diff --git a/Build_God_Game/src/views/LoginView.vue b/Build_God_Game/src/views/LoginView.vue index febb329..acec16a 100644 --- a/Build_God_Game/src/views/LoginView.vue +++ b/Build_God_Game/src/views/LoginView.vue @@ -3,9 +3,7 @@ import { ref } from 'vue' import { useRouter } from 'vue-router' import { useAuthStore } from '@/stores/auth' import Particles from '@/components/Particles/Particles.vue' -import GlareHover from '@/components/GlareHover/GlareHover.vue' import BlurText from '@/components/BlurText/BlurText.vue' -import StarBorder from '@/components/StarBorder/StarBorder.vue' const router = useRouter() const authStore = useAuthStore() @@ -77,12 +75,10 @@ const handleLogin = async () => { {{ errorMsg }} - -
- 登录中... - 登 录 -
-
+
+ 登录中... + 开始游戏 +
@@ -125,9 +121,9 @@ const handleLogin = async () => { } .login-card { - background: rgba(255, 255, 255, 0.03); + background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(20px); - border: 1px solid rgba(255, 255, 255, 0.08); + border: 1px solid rgba(255, 255, 255, 0.15); border-radius: 20px; padding: 36px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.8); @@ -221,31 +217,47 @@ const handleLogin = async () => { border-radius: 8px; } -.login-button { - margin-top: 8px; +.btn-ink { + position: relative; display: flex; - align-items: center; justify-content: center; + align-items: center; + width: 220px; + height: 80px; + margin: 0 auto; + font-family: "STKaiti", "KaiTi", "华文楷体", "Microsoft YaHei", cursive; + font-size: 18px; + font-weight: bold; + color: #ffffff; + letter-spacing: 4px; cursor: pointer; + border: none; + background: transparent; + z-index: 1; } -.btn-login { - display: flex; - justify-content: center; - align-items: center; - border: 1px dashed greenyellow; - border-radius: 15px; - background: rgba(255, 255, 255, 0.03); - padding: 12px 16px; - cursor: pointer; - height: 100%; +.btn-ink::before { + content: ''; + position: absolute; + inset: 0; + background: url(@/assets/brushbutton.png) no-repeat center; + background-size: contain; + transition: transform 0.3s ease; + z-index: -1; +} + +.btn-ink:hover::before { + transform: scale(1.05); +} + +.btn-ink:active::before { + transform: scale(0.95); } .button-text, .loading-text { - color: #ffffff; - font-weight: bold; - letter-spacing: 0.2em; + position: relative; + z-index: 1; } .login-footer {