🐛 更新主界面图片显示CSS

layouts/UserLayout.vue

@@ -4,9 +4,7 @@ import useColorModeStore from '~/stores/colorModeStore';
 import { useWindowScroll } from '@vueuse/core';
 
 const { colorMode } = storeToRefs(useColorModeStore());
-watch(colorMode, () => {
+
-  console.log('colorMode changed:', colorMode.value);
-});
 const isHome = computed(() => useRoute().path === '/');
 const items = ref<NavigationMenuItem[]>([
   {
@@ -84,12 +82,12 @@ onMounted(() => {
         }" @mouseleave="collapsed = true">
           <div
               v-if="colorMode === 'light'"
-              class="flex w-full h-full absolute bg-[url('/79d52228c770808810a310115567e6790380823a.webp')] bg-cover bg-top ">
+              class="flex bg-top absolute w-full h-full bg-[url('/79d52228c770808810a310115567e6790380823a.webp')] ">
             <slot name="header"/>
           </div>
           <div
               v-else
-              class="flex w-full h-full max-h-80 absolute bg-[url('/anime-8788959.webp')] bg-cover bg-center">
+              class="flex bg-top absolute w-full h-full bg-[url('/anime-8788959.webp')]">
             <slot name="header"/>
           </div>
           <!-- header picture -->

package.json

@@ -36,8 +36,11 @@
   "packageManager": "pnpm@10.18.0",
   "devDependencies": {
     "@iconify-json/clarity": "^1.2.4",
+    "@iconify-json/codicon": "^1.2.32",
+    "@iconify-json/fluent": "^1.2.34",
     "@iconify-json/lucide": "^1.2.68",
     "@iconify-json/material-symbols": "^1.2.40",
+    "@iconify-json/octicon": "^1.2.19",
     "@stylistic/eslint-plugin": "^5.4.0",
     "@stylistic/eslint-plugin-jsx": "^4.4.1",
     "@vue/eslint-config-typescript": "^14.6.0",