changes

app/components/TopMenu.vue

@@ -3,10 +3,10 @@
     class="navbar has-shadow sticky top-0 px-3"
     role="navigation"
   >
-    <div class="navbar-brand mr-5">
+    <div class="navbar-brand mr-3">
       <div class="navbar-item is-gap-1">
         <div class="size-4 has-background-primary rounded-full"></div>
-        <span class="fs-16 font-semibold has-text-primary">{{ $dayjs().format("DD/MM") }}</span>
+        <span class="font-semibold has-text-primary">{{ $dayjs().format("DD/MM") }}</span>
       </div>
       <a
         class="navbar-item p-0 has-text-primary"
@@ -42,7 +42,7 @@
       </a>
     </div>
     <div
-      class="navbar-menu"
+      class="navbar-menu is-flex-shrink-1"
       id="navMenu"
     >
       <div class="navbar-start is-gap-1 is-align-items-center">
@@ -95,20 +95,22 @@
           </div>
         </template>
       </div>
-      <!-- <div class="navbar-end">
-        <a class="navbar-item" @click="changeTab(tabConfig)" v-if="tabConfig">
-          <Icon name="material-symbols:settings-outline-rounded" :size="20" />
+      <div class="navbar-end is-gap-1 is-align-items-center">
+        <!-- v-if="tabConfig" -->
+        <a
+          class="navbar-item rounded-lg p-1.5"
+          @click="changeTab(tabConfig)"
+        >
+          <Icon
+            name="material-symbols:settings-outline-rounded"
+            :size="20"
+            class="has-text-grey-60"
+          />
         </a>
-        <a class="navbar-item" @click="openProfile()" v-if="avatar">
-          <Avatarbox v-bind="avatar"></Avatarbox>
-        </a>
-      </div> -->
-      <div class="navbar-end">
-        <a class="navbar-item is-flex is-gap-2 is-justify-content-space-between is-align-items-center">
-          <div>
-            <p class="fs-13">Xin chào,</p>
-            <p class="fs-14 font-bold">Quản lý</p>
-          </div>
+        <!-- @click="openProfile()" v-if="avatar" -->
+        <a
+          class="navbar-item rounded-full p-0 max-w-full is-flex is-gap-2 is-justify-content-space-between is-align-items-center"
+        >
           <Avatarbox
             text="Q"
             type="findata"