wlt/ai-dimension
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 色彩饱和度+10%+微信登录按钮全宽+图标

Browse Source
This commit is contained in:
Yuzhiran Dev
2026-07-12 13:46:03 +08:00
parent 1c70e89ab8
commit 06d7d9700c
2 changed files with 92 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/App.vue
+83 -83
View File
@@ -95,56 +95,56 @@ page, .theme-light {
--text-disabled: rgba(13, 13, 26, 0.15);
/* 品牌色 — Indigo 高饱和 */
--color-brand: #6366f1;
--color-brand-light: #818cf8;
--color-brand: #5b5ff8;
--color-brand-light: #7b87fd;
--color-brand-dark: #4f46e5;
--color-brand-bg: rgba(99, 102, 241, 0.08);
--color-brand-glow: rgba(99, 102, 241, 0.1);
--color-brand-bg: rgba(91, 95, 248, 0.08);
--color-brand-glow: rgba(91, 95, 248, 0.1);
/* 维度色 — 高饱和度，在浅色底上鲜艳 */
--dim1-color: #6366f1;
--dim1-bg: rgba(99, 102, 241, 0.2);
--dim1-icon-bg: rgba(99, 102, 241, 0.25);
--dim1-border: rgba(99, 102, 241, 0.3);
--dim1-glow: rgba(99, 102, 241, 0.08);
--dim1-color: #5b5ff8;
--dim1-bg: rgba(91, 95, 248, 0.2);
--dim1-icon-bg: rgba(91, 95, 248, 0.25);
--dim1-border: rgba(91, 95, 248, 0.3);
--dim1-glow: rgba(91, 95, 248, 0.08);
--dim2-color: #0891b2;
--dim2-bg: rgba(8, 145, 178, 0.2);
--dim2-icon-bg: rgba(8, 145, 178, 0.25);
--dim2-border: rgba(8, 145, 178, 0.3);
--dim2-glow: rgba(8, 145, 178, 0.08);
--dim2-color: #0095ba;
--dim2-bg: rgba(0, 149, 186, 0.2);
--dim2-icon-bg: rgba(0, 149, 186, 0.25);
--dim2-border: rgba(0, 149, 186, 0.3);
--dim2-glow: rgba(0, 149, 186, 0.08);
--dim3-color: #059669;
--dim3-bg: rgba(5, 150, 105, 0.2);
--dim3-icon-bg: rgba(5, 150, 105, 0.25);
--dim3-border: rgba(5, 150, 105, 0.3);
--dim3-glow: rgba(5, 150, 105, 0.08);
--dim3-color: #009b6a;
--dim3-bg: rgba(0, 155, 106, 0.2);
--dim3-icon-bg: rgba(0, 155, 106, 0.25);
--dim3-border: rgba(0, 155, 106, 0.3);
--dim3-glow: rgba(0, 155, 106, 0.08);
--dim4-color: #d97706;
--dim4-bg: rgba(217, 119, 6, 0.2);
--dim4-icon-bg: rgba(217, 119, 6, 0.25);
--dim4-border: rgba(217, 119, 6, 0.3);
--dim4-glow: rgba(217, 119, 6, 0.08);
--dim4-color: #df7700;
--dim4-bg: rgba(223, 119, 0, 0.2);
--dim4-icon-bg: rgba(223, 119, 0, 0.25);
--dim4-border: rgba(223, 119, 0, 0.3);
--dim4-glow: rgba(223, 119, 0, 0.08);
--dim5-color: #dc2626;
--dim5-bg: rgba(220, 38, 38, 0.2);
--dim5-icon-bg: rgba(220, 38, 38, 0.25);
--dim5-border: rgba(220, 38, 38, 0.3);
--dim5-glow: rgba(220, 38, 38, 0.08);
--dim5-color: #e51c1c;
--dim5-bg: rgba(229, 28, 28, 0.2);
--dim5-icon-bg: rgba(229, 28, 28, 0.25);
--dim5-border: rgba(229, 28, 28, 0.3);
--dim5-glow: rgba(229, 28, 28, 0.08);
/* 功能色 */
--color-free: #059669;
--color-free-bg: rgba(5, 150, 105, 0.1);
--color-pro: #d97706;
--color-pro-bg: rgba(217, 119, 6, 0.1);
--color-vip: #dc2626;
--color-vip-bg: rgba(220, 38, 38, 0.1);
--color-hot: #dc2626;
--color-hot-bg: rgba(220, 38, 38, 0.12);
--color-new: #0891b2;
--color-new-bg: rgba(8, 145, 178, 0.12);
--color-pick: #6366f1;
--color-pick-bg: rgba(99, 102, 241, 0.12);
--color-free: #009b6a;
--color-free-bg: rgba(0, 155, 106, 0.1);
--color-pro: #df7700;
--color-pro-bg: rgba(223, 119, 0, 0.1);
--color-vip: #e51c1c;
--color-vip-bg: rgba(229, 28, 28, 0.1);
--color-hot: #e51c1c;
--color-hot-bg: rgba(229, 28, 28, 0.12);
--color-new: #0095ba;
--color-new-bg: rgba(0, 149, 186, 0.12);
--color-pick: #5b5ff8;
--color-pick-bg: rgba(91, 95, 248, 0.12);
/* 圆角/间距/过渡 */
--radius-sm: 8px;
@@ -189,54 +189,54 @@ page, .theme-light {
--text-muted: rgba(255, 255, 255, 0.3);
--text-disabled: rgba(255, 255, 255, 0.15);
--color-brand: #818cf8;
--color-brand-light: #a5b4fc;
--color-brand-dark: #6366f1;
--color-brand-bg: rgba(99, 102, 241, 0.12);
--color-brand-glow: rgba(99, 102, 241, 0.15);
--color-brand: #7b87fd;
--color-brand-light: #a2b2ff;
--color-brand-dark: #5b5ff8;
--color-brand-bg: rgba(91, 95, 248, 0.12);
--color-brand-glow: rgba(91, 95, 248, 0.15);
--dim1-color: #a78bfa;
--dim1-bg: rgba(99, 102, 241, 0.12);
--dim1-icon-bg: rgba(99, 102, 241, 0.2);
--dim1-border: rgba(99, 102, 241, 0.18);
--dim1-glow: rgba(99, 102, 241, 0.08);
--dim1-color: #a485ff;
--dim1-bg: rgba(164, 133, 255, 0.12);
--dim1-icon-bg: rgba(164, 133, 255, 0.2);
--dim1-border: rgba(164, 133, 255, 0.18);
--dim1-glow: rgba(164, 133, 255, 0.08);
--dim2-color: #60a5fa;
--dim2-bg: rgba(96, 165, 250, 0.12);
--dim2-icon-bg: rgba(96, 165, 250, 0.2);
--dim2-border: rgba(96, 165, 250, 0.18);
--dim2-glow: rgba(96, 165, 250, 0.08);
--dim2-color: #5ba4ff;
--dim2-bg: rgba(91, 164, 255, 0.12);
--dim2-icon-bg: rgba(91, 164, 255, 0.2);
--dim2-border: rgba(91, 164, 255, 0.18);
--dim2-glow: rgba(91, 164, 255, 0.08);
--dim3-color: #34d399;
--dim3-bg: rgba(52, 211, 153, 0.12);
--dim3-icon-bg: rgba(52, 211, 153, 0.2);
--dim3-border: rgba(52, 211, 153, 0.18);
--dim3-glow: rgba(52, 211, 153, 0.08);
--dim3-color: #2cda9b;
--dim3-bg: rgba(44, 218, 155, 0.12);
--dim3-icon-bg: rgba(44, 218, 155, 0.2);
--dim3-border: rgba(44, 218, 155, 0.18);
--dim3-glow: rgba(44, 218, 155, 0.08);
--dim4-color: #fbbf24;
--dim4-bg: rgba(251, 191, 36, 0.12);
--dim4-icon-bg: rgba(251, 191, 36, 0.2);
--dim4-border: rgba(251, 191, 36, 0.18);
--dim4-glow: rgba(251, 191, 36, 0.08);
--dim4-color: #ffc020;
--dim4-bg: rgba(255, 192, 32, 0.12);
--dim4-icon-bg: rgba(255, 192, 32, 0.2);
--dim4-border: rgba(255, 192, 32, 0.18);
--dim4-glow: rgba(255, 192, 32, 0.08);
--dim5-color: #fb7185;
--dim5-bg: rgba(251, 113, 133, 0.12);
--dim5-icon-bg: rgba(251, 113, 133, 0.2);
--dim5-border: rgba(251, 113, 133, 0.18);
--dim5-glow: rgba(251, 113, 133, 0.08);
--dim5-color: #ff6c82;
--dim5-bg: rgba(255, 108, 130, 0.12);
--dim5-icon-bg: rgba(255, 108, 130, 0.2);
--dim5-border: rgba(255, 108, 130, 0.18);
--dim5-glow: rgba(255, 108, 130, 0.08);
--color-free: #34d399;
--color-free-bg: rgba(52, 211, 153, 0.12);
--color-pro: #fbbf24;
--color-pro-bg: rgba(251, 191, 36, 0.12);
--color-vip: #fb7185;
--color-vip-bg: rgba(251, 113, 133, 0.12);
--color-hot: #fb7185;
--color-hot-bg: rgba(251, 113, 133, 0.15);
--color-new: #60a5fa;
--color-new-bg: rgba(96, 165, 250, 0.15);
--color-pick: #a78bfa;
--color-pick-bg: rgba(99, 102, 241, 0.15);
--color-free: #2cda9b;
--color-free-bg: rgba(44, 218, 155, 0.12);
--color-pro: #ffc020;
--color-pro-bg: rgba(255, 192, 32, 0.12);
--color-vip: #ff6c82;
--color-vip-bg: rgba(255, 108, 130, 0.12);
--color-hot: #ff6c82;
--color-hot-bg: rgba(255, 108, 130, 0.15);
--color-new: #5ba4ff;
--color-new-bg: rgba(91, 164, 255, 0.15);
--color-pick: #a485ff;
--color-pick-bg: rgba(164, 133, 255, 0.15);
--glow-brand: 0 0 20px rgba(99, 102, 241, 0.1);
--glow-brand-strong: 0 0 30px rgba(99, 102, 241, 0.15);
client/src/pages/login/login.vue
+9 -2
View File
@@ -36,6 +36,7 @@
<!-- 微信小程序一键登录入口 -->
<view class="wx-login-row" v-if="isMiniApp">
<view class="wx-login-btn" @click="wechatLogin">
<text class="wx-icon">💬</text>
<text>微信一键登录</text>
</view>
</view>
@@ -363,7 +364,8 @@ const handleRegister = async () => {
justify-content: center;
.wx-login-btn {
padding: 10px 28px;
width: 100%;
height: 46px;
display: flex;
align-items: center;
justify-content: center;
@@ -371,14 +373,19 @@ const handleRegister = async () => {
background: linear-gradient(135deg, #07c160, #06ad56);
color: white;
border-radius: 10px;
font-size: 14px;
font-size: 15px;
font-weight: 600;
cursor: pointer;
box-shadow: 0 4px 16px rgba(7, 193, 96, 0.3);
transition: opacity 0.3s;
&:active {
opacity: 0.8;
}
.wx-icon {
font-size: 18px;
}
}
}