diff --git a/demo/frontend/src/App.vue b/demo/frontend/src/App.vue index 1fa0c2d..f1cd50e 100644 --- a/demo/frontend/src/App.vue +++ b/demo/frontend/src/App.vue @@ -111,50 +111,32 @@ main.with-navbar { background-attachment: fixed; } -/* 登录页面特殊背景处理 */ +/* 登录页面特殊背景处理 - 参考Welcome页面样式 */ #app[data-route="Login"] .fullscreen-background { background: url('/images/backgrounds/login.png') center/cover no-repeat; background-attachment: fixed; + min-height: 100vh; + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; } /* ========== 页面特殊样式 ========== */ -/* 欢迎页面 - 深色科技风全屏覆盖 */ +/* 欢迎页面 - 参考Welcome页面样式 */ .fullscreen-background.Welcome { - background: - radial-gradient(ellipse at center, rgba(0, 50, 100, 0.8) 0%, rgba(0, 20, 40, 0.9) 50%, rgba(0, 0, 0, 1) 100%), - linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%); - animation: welcomeGlow 6s ease-in-out infinite alternate; + background: url('/images/backgrounds/welcome.jpg') center/cover no-repeat; + background-attachment: fixed; + min-height: 100vh; + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; } -.fullscreen-background.Welcome::before { - content: ''; - position: absolute; - top: 50%; - left: 50%; - width: 80%; - height: 60%; - transform: translate(-50%, -50%); - background: - radial-gradient(ellipse at center, rgba(100, 150, 255, 0.3) 0%, rgba(50, 100, 200, 0.2) 30%, transparent 70%); - animation: centralGlow 8s ease-in-out infinite alternate; -} - -@keyframes welcomeGlow { - 0% { opacity: 0.8; } - 100% { opacity: 1; } -} - -@keyframes centralGlow { - 0% { - opacity: 0.3; - transform: translate(-50%, -50%) scale(1); - } - 100% { - opacity: 0.7; - transform: translate(-50%, -50%) scale(1.1); - } -} /* 首页 - 深色科技风全屏覆盖 */ .fullscreen-background.Home {