diff --git a/src/assets/css/style.css b/src/assets/css/style.css
index c161108..96ba6a8 100644
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -1098,10 +1098,6 @@ select {
   margin-top: 1.5rem;
 }
 
-.mt-12 {
-  margin-top: 3rem;
-}
-
 .line-clamp-1 {
   overflow: hidden;
   display: -webkit-box;
@@ -1185,6 +1181,10 @@ select {
   height: 2.7rem;
 }
 
+.h-\[66px\] {
+  height: 66px;
+}
+
 .h-\[calc\(100\%-64px\)\] {
   height: calc(100% - 64px);
 }
@@ -1202,10 +1202,6 @@ select {
   height: 80vh;
 }
 
-.h-\[66px\] {
-  height: 66px;
-}
-
 .max-h-0 {
   max-height: 0px;
 }
@@ -1334,10 +1330,6 @@ select {
   flex: 1 1 0%;
 }
 
-.flex-auto {
-  flex: 1 1 auto;
-}
-
 .flex-none {
   flex: none;
 }
@@ -1528,18 +1520,18 @@ select {
   margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
 }
 
-.space-y-4 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
-}
-
 .space-y-3 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
 }
 
+.space-y-4 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
+}
+
 .divide-y > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-y-reverse: 0;
   border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
@@ -1819,14 +1811,14 @@ select {
   --tw-bg-opacity: 0.8;
 }
 
-.fill-gray-400 {
-  fill: #9ca3af;
-}
-
 .fill-gray-500 {
   fill: #6b7280;
 }
 
+.fill-gray-600 {
+  fill: #4b5563;
+}
+
 .fill-primary-500 {
   fill: #035b71;
 }
@@ -1843,10 +1835,6 @@ select {
   fill: #fff;
 }
 
-.fill-gray-600 {
-  fill: #4b5563;
-}
-
 .stroke-white {
   stroke: #fff;
 }
@@ -2050,6 +2038,10 @@ select {
   text-align: center;
 }
 
+.text-start {
+  text-align: start;
+}
+
 .text-2xl {
   font-size: 1.5rem;
   line-height: 2rem;
@@ -2204,6 +2196,11 @@ select {
   color: rgb(55 65 81 / var(--tw-text-opacity));
 }
 
+.text-gray-800 {
+  --tw-text-opacity: 1;
+  color: rgb(31 41 55 / var(--tw-text-opacity));
+}
+
 .text-gray-900 {
   --tw-text-opacity: 1;
   color: rgb(17 24 39 / var(--tw-text-opacity));
@@ -2304,15 +2301,6 @@ select {
   color: rgb(153 153 0 / var(--tw-text-opacity));
 }
 
-.text-gray-800 {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
-
-.text-opacity-100 {
-  --tw-text-opacity: 1;
-}
-
 .text-opacity-40 {
   --tw-text-opacity: 0.4;
 }
@@ -2339,14 +2327,14 @@ select {
   opacity: 0.3;
 }
 
-.opacity-50 {
-  opacity: 0.5;
-}
-
 .opacity-40 {
   opacity: 0.4;
 }
 
+.opacity-50 {
+  opacity: 0.5;
+}
+
 .shadow {
   --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -2753,58 +2741,36 @@ select {
   display: block;
 }
 
-.group:hover .group-hover\:bg-gray-900 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
-}
-
 .group:hover .group-hover\:bg-primary-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(3 91 113 / var(--tw-bg-opacity));
 }
 
-.group:hover .group-hover\:bg-opacity-5 {
-  --tw-bg-opacity: 0.05;
-}
-
 .group:hover .group-hover\:bg-opacity-80 {
   --tw-bg-opacity: 0.8;
 }
 
-.group:hover .group-hover\:fill-gray-500 {
-  fill: #6b7280;
+.group:hover .group-hover\:fill-primary-500 {
+  fill: #035b71;
 }
 
 .group:hover .group-hover\:fill-white {
   fill: #fff;
 }
 
-.group:hover .group-hover\:fill-primary-500 {
-  fill: #035b71;
-}
-
 .group:hover .group-hover\:text-gray-500 {
   --tw-text-opacity: 1;
   color: rgb(107 114 128 / var(--tw-text-opacity));
 }
 
-.group:hover .group-hover\:text-white {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-}
-
-.group:hover .group-hover\:text-gray-900 {
-  --tw-text-opacity: 1;
-  color: rgb(17 24 39 / var(--tw-text-opacity));
-}
-
 .group:hover .group-hover\:text-primary-500 {
   --tw-text-opacity: 1;
   color: rgb(3 91 113 / var(--tw-text-opacity));
 }
 
-.group:hover .group-hover\:opacity-100 {
-  opacity: 1;
+.group:hover .group-hover\:text-white {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
 @media (prefers-color-scheme: dark) {
@@ -3238,16 +3204,16 @@ select {
     padding: 5rem;
   }
 
-  .md\:px-4 {
-    padding-left: 1rem;
-    padding-right: 1rem;
-  }
-
   .md\:px-0 {
     padding-left: 0px;
     padding-right: 0px;
   }
 
+  .md\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
   .md\:py-0 {
     padding-top: 0px;
     padding-bottom: 0px;
diff --git a/src/components/CommandPalettes.vue b/src/components/CommandPalettes.vue
index 4361465..93239ce 100644
--- a/src/components/CommandPalettes.vue
+++ b/src/components/CommandPalettes.vue
@@ -23,7 +23,7 @@
                             </div>
 
                             <ComboboxOptions v-if="query === '' || filteredMenus.length > 0" static
-                                class="overflow-y-auto divide-y divide-gray-500 max-h-80 scroll-py-2 divide-opacity-10">
+                                class="overflow-y-auto divide-y divide-gray-500 scroll-py-2 divide-opacity-10">
                                 <li class="p-2" v-if="filteredMenus.length > 0 || recent.length > 0">
                                     <h2 v-if="query === '' && recent.length > 0"
                                         class="px-3 mt-4 mb-2 text-xs font-semibold text-gray-900">
@@ -62,7 +62,7 @@
                                                     :class="['h-6 w-6 flex-none', active ? 'opacity-100' : 'opacity-40']" />
 
                                                 <div class="flex flex-col flex-1 ml-3 space-y-1">
-                                                    <span class="text-sm font-medium text-gray-800 truncate line-clamp-1">
+                                                    <span class="text-sm font-medium text-gray-800 line-clamp-1">
                                                         {{ menu.name }}
                                                     </span>
                                                     <span class="text-xs text-gray-500 line-clamp-1">
diff --git a/src/components/Pages/Welcome.vue b/src/components/Pages/Welcome.vue
index e0f4ceb..2f0d5c1 100644
--- a/src/components/Pages/Welcome.vue
+++ b/src/components/Pages/Welcome.vue
@@ -1,12 +1,12 @@
 <template>
-    <div class="flex flex-col items-center justify-center px-6 text-center whitespace-pre-wrap h-screen-80">
-        <div class="w-full md:w-[440px] px-4 py-4 md:px-0 md:py-0 flex flex-col items-center">
+    <div class="flex flex-col items-center justify-center px-4 text-center whitespace-pre-wrap h-screen-80">
+        <div class="w-full md:w-[440px] py-4 md:py-0 flex flex-col items-center">
             <img :src="IconApp" alt="pln" class="h-[66px] object-contain mx-auto mb-4">
             <button @click="command.showCommandPalettes" type="button"
                 class="flex flex-row items-center w-full p-2 text-gray-400 rounded-full bg-gray-50 hover:text-primary-500 focus:outline-none focus:ring-0">
                 <span class="sr-only">Search</span>
                 <MagnifyingGlassIcon class="w-6 h-6 text-primary-500" aria-hidden="true" />
-                <span class="hidden px-3 text-sm font-medium text-gray-500 md:block text-md">Cari menu</span>
+                <span class="px-3 text-sm font-medium text-gray-500 text-md">Cari menu</span>
             </button>
 
             <div v-if="query === '' || filteredMenus.length > 0" static class="w-full mt-6 md:mt-8 lg:mt-12">
@@ -20,35 +20,35 @@
                             <div
                                 class="flex flex-row items-center justify-between px-3 py-2 rounded-md cursor-pointer select-none group-hover:bg-primary-500 group-hover:text-white group-hover:bg-opacity-80">
                                 <component v-if="menu.path.includes('/gangguan/')" :is="navigationIcon[0]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/keluhan/')" :is="navigationIcon[1]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/monalisa/')" :is="navigationIcon[2]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/check-in-out/')" :is="navigationIcon[3]"
-                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/anomali-pengaduan/')" :is="navigationIcon[4]"
-                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/ctt-kwh-periksa/')" :is="navigationIcon[5]"
-                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    alt="icon" :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/material/')" :is="navigationIcon[6]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else-if="menu.path.includes('/transaksi/')" :is="navigationIcon[7]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
                                 <component v-else :is="navigationIcon[8]" alt="icon"
-                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white']" />
+                                    :class="['w-8 h-8 fill-gray-600 group-hover:fill-white flex']" />
 
-                                <div class="flex flex-col items-start flex-1 ml-3 space-y-1">
+                                <div class="flex flex-col items-start flex-1 w-full pl-3 space-y-1">
                                     <span
-                                        class="text-sm font-medium text-gray-800 truncate group-hover:text-white line-clamp-1">
+                                        class="w-full text-sm font-medium text-gray-800 text-start group-hover:text-white line-clamp-1">
                                         {{ menu.name }}
                                     </span>
-                                    <span class="text-xs text-gray-500 group-hover:text-white line-clamp-1">
+                                    <span
+                                        class="w-full text-xs text-gray-500 text-start group-hover:text-white line-clamp-1">
                                         {{ menu.path.replace('/home/', '') }}
                                     </span>
                                 </div>
-                                <span
-                                    class="flex-none hidden ml-3 text-sm text-gray-500 group-hover:block group-hover:text-white">
+                                <span class="hidden ml-3 text-sm text-gray-500 group-hover:block group-hover:text-white">
                                     Buka
                                 </span>
                             </div>