xinyin025/geekai
1
0
Fork 0
mirror of https://github.com/yangjian102621/geekai.git synced 2026-04-21 10:34:26 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

登录注册页面支持 dark 主题模式

Browse Source
This commit is contained in:
GeekMaster
2025-08-15 18:51:33 +08:00
parent c0832a24b9
commit 6242f648f1
4 changed files with 31 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
web/src/assets/css/theme-dark.scss
View File

@@ -1,10 +1,17 @@
@use 'font.scss' as *;
:root[data-theme="dark"] {
:root[data-theme='dark'] {
--text-fb: #fff;
--text-color: rgba(255, 255, 255, 1) !important; // 主要的文本颜色
--normal-color: rgba(163, 174, 208, 1); // 普通颜色
--el-text-color-primary: #fff;
p, h1, h2, h3, h4, h5, h6, article {
p,
h1,
h2,
h3,
h4,
h5,
h6,
article {
// color: var(--text-color) !important;
font-family: $font-regular;
}
@@ -107,4 +114,4 @@
--login-text-color: #a3aed0;
--login-link-color: #d1c7ff;
--login-link-hover-bg: rgba(209, 199, 255, 0.1);
}
}

12
web/src/components/LoginDialog.vue
View File

@@ -43,13 +43,13 @@
<div class="w-full">
<div
class="text flex justify-center items-center pt-3 text-sm"
style="color: var(--login-text-color);"
style="color: var(--login-text-color)"
>
还没有账号？
<el-button
size="small"
class="ml-2 rounded-md px-2 py-1 transition-colors duration-200"
style="color: var(--login-link-color);"
style="color: var(--login-link-color)"
@click="login = false"
@mouseenter="$event.target.style.background = 'var(--login-link-hover-bg)'"
@mouseleave="$event.target.style.background = 'transparent'"
@@ -217,14 +217,16 @@
<div
class="text text-sm flex justify-center items-center w-full pt-3"
style="color: var(--login-text-color);"
style="color: var(--login-text-color)"
>
已有账号？
<el-button
size="small"
class="ml-2 rounded-md px-2 py-1"
style="color: var(--login-link-color);"
class="ml-2 rounded-md px-2 py-1 transition-colors duration-200"
style="color: var(--login-link-color)"
@click="login = true"
@mouseenter="$event.target.style.background = 'var(--login-link-hover-bg)'"
@mouseleave="$event.target.style.background = 'transparent'"
>登录</el-button
>
</div>

20
web/src/views/Login.vue
View File

@@ -1,12 +1,12 @@
<template>
<div
class="min-h-screen flex items-center justify-center p-5 relative overflow-auto"
style="background: var(--login-bg);"
style="background: var(--login-bg)"
>
<router-link
to="/"
class="fixed top-5 left-5 z-50 flex items-center justify-center w-11 h-11 border border-transparent rounded-xl text-white no-underline shadow-lg backdrop-blur-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-xl"
style="background: var(--btnColor);"
style="background: var(--btnColor)"
title="返回首页"
>
<i class="iconfont icon-home text-xl"></i>
@@ -14,23 +14,17 @@
<div class="w-full max-w-md mx-auto">
<div
class="rounded-3xl p-10 shadow-2xl backdrop-blur-sm relative overflow-hidden"
style="background: var(--login-card-bg); border: 1px solid var(--login-card-border);"
style="background: var(--login-card-bg); border: 1px solid var(--login-card-border)"
>
<div
class="absolute top-0 left-0 right-0 h-1"
style="background: var(--btnColor);"
></div>
<div class="absolute top-0 left-0 right-0 h-1" style="background: var(--btnColor)"></div>
<div class="text-center mb-8">
<h1
<h1
class="text-3xl font-semibold m-0 mb-2 tracking-tight"
style="color: var(--login-title-color);"
style="color: var(--login-title-color)"
>
欢迎登录
</h1>
<p
class="text-base m-0 leading-relaxed"
style="color: var(--login-subtitle-color);"
>
<p class="text-base m-0 leading-relaxed" style="color: var(--login-subtitle-color)">
登录您的账户以继续使用服务
</p>
</div>

20
web/src/views/Register.vue
View File

@@ -1,12 +1,12 @@
<template>
<div
class="min-h-screen flex items-center justify-center p-5 relative overflow-auto"
style="background: var(--login-bg);"
style="background: var(--login-bg)"
>
<router-link
to="/"
class="fixed top-5 left-5 z-50 flex items-center justify-center w-11 h-11 border border-transparent rounded-xl text-white no-underline shadow-lg backdrop-blur-sm transition-all duration-300 hover:-translate-y-0.5 hover:shadow-xl"
style="background: var(--btnColor);"
style="background: var(--btnColor)"
title="返回首页"
>
<i class="iconfont icon-home text-xl"></i>
@@ -14,23 +14,17 @@
<div class="w-full max-w-md mx-auto">
<div
class="rounded-3xl p-10 shadow-2xl backdrop-blur-sm relative overflow-hidden"
style="background: var(--login-card-bg); border: 1px solid var(--login-card-border);"
style="background: var(--login-card-bg); border: 1px solid var(--login-card-border)"
>
<div
class="absolute top-0 left-0 right-0 h-1"
style="background: var(--btnColor);"
></div>
<div class="absolute top-0 left-0 right-0 h-1" style="background: var(--btnColor)"></div>
<div class="text-center mb-8">
<h1
<h1
class="text-3xl font-semibold m-0 mb-2 tracking-tight"
style="color: var(--login-title-color);"
style="color: var(--login-title-color)"
>
用户注册
</h1>
<p
class="text-base m-0 leading-relaxed"
style="color: var(--login-subtitle-color);"
>
<p class="text-base m-0 leading-relaxed" style="color: var(--login-subtitle-color)">
创建您的账户以开始使用服务
</p>
</div>