From dfe75c314a2835de746293c485934cccf48fe344 Mon Sep 17 00:00:00 2001
From: keven1024 <keven@fudaoyuan.icu>
Date: Sun, 1 Jun 2025 21:21:25 +0800
Subject: [PATCH] fix(front): update Navbar and default layout for improved
 sticky behavior and background image

---
 front/components/Navbar.vue |  2 +-
 front/layouts/default.vue   | 20 ++++++++++++--------
 2 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/front/components/Navbar.vue b/front/components/Navbar.vue
index d20cbbd..82c4741 100644
--- a/front/components/Navbar.vue
+++ b/front/components/Navbar.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="flex flex-row bg-white/50 backdrop-blur-xl p-2 rounded-full gap-1"
+    class="flex flex-row bg-white/50 backdrop-blur-xl p-2 rounded-full gap-1 sticky top-0 z-10"
   >
     <div
       v-for="item in routes"
diff --git a/front/layouts/default.vue b/front/layouts/default.vue
index 6bbb67f..d134a8d 100644
--- a/front/layouts/default.vue
+++ b/front/layouts/default.vue
@@ -1,16 +1,20 @@
 <script lang="ts" setup>
-import { Toaster } from 'vue-sonner'
-await useSeo()
+import { Toaster } from "vue-sonner";
+await useSeo();
 </script>
 <template>
-  <div class="h-screen w-screen ">
+  <div class="h-screen w-screen">
     <GlobalDrawer />
-    <img class="w-full h-full object-cover absolute inset-0 -z-[1]" src="https://fuwari.vercel.app/_astro/demo-banner.DFyx781H_Z1gN7UP.webp" />
-    <Toaster position="top-center" richColors closeButton  />
-    <div class=" h-full w-full flex flex-col items-center lg:p-10 p-5">
+    <Toaster position="top-center" richColors closeButton />
+    <img
+      class="w-full h-full object-cover absolute inset-0 -z-[1]"
+      src="https://fuwari.vercel.app/_astro/demo-banner.DFyx781H_Z1gN7UP.webp"
+    />
+    <div
+      class="h-full w-full flex flex-col items-center lg:p-10 p-5 overflow-y-auto"
+    >
       <Navbar />
       <slot />
     </div>
-
   </div>
-</template>
\ No newline at end of file
+</template>