🐛 Use abs position for nav

app/layouts/default.vue

@@ -3,25 +3,33 @@
     <header
       class="navbar bg-transparent shadow-lg fixed top-0 left-0 right-0 backdrop-blur-2xl z-1000 h-[64px]"
     >
-      <div class="container mx-auto flex items-center justify-between px-5">
+      <div
+        class="container mx-auto flex items-center justify-between px-5 relative"
+      >
         <nuxt-link-locale to="/">
           <nuxt-img src="/favicon.png" alt="Solsynth" class="w-8 h-8" />
         </nuxt-link-locale>
 
-        <n-menu
+        <div
+          class="absolute left-0 right-0 flex w-full justify-center"
           v-if="breakpoints.isGreaterOrEqual('md')"
+        >
+          <n-menu
             v-model:value="activeKey"
             mode="horizontal"
             :options="menuOptions"
             style="width: auto"
           />
+        </div>
         <n-popover v-else trigger="hover">
           <template #trigger>
+            <div class="absolute left-0 right-0 flex w-full justify-center">
               <n-button text>
                 <template #icon>
                   <n-icon :component="MenuOutlined" />
                 </template>
               </n-button>
+            </div>
           </template>
           <n-menu
             v-model:value="activeKey"