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

fix: 亮色主题-加深背景层次感+加大饱和度

Browse Source
This commit is contained in:
Yuzhiran Dev
2026-07-11 17:13:52 +08:00
parent 1760668d0f
commit 8e8e3d5da2
3 changed files with 55 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/App.vue
+48 -48
View File
@@ -72,79 +72,79 @@ function applyTabBarTheme(theme) {
默认：亮色模式（蓝紫主题） | .theme-dark：暗色模式
============================================ */
/* ---- 亮色模式（默认：清爽中性，品牌色点缀） ---- */
/* ---- 亮色模式（默认：层次分明，视觉丰富） ---- */
page, .theme-light {
/* 基础色 — 清爽中性 */
--bg-primary: #f8f9fc;
--bg-secondary: #ffffff;
--bg-tertiary: #f0f1f5;
/* 基础色 — 层次感 */
--bg-primary: #edeff3;
--bg-secondary: #f5f6f9;
--bg-tertiary: #e2e5ec;
/* 玻璃拟态 — 白底+阴影，不用有色玻璃 */
/* 卡片 — 纯白+阴影+细边框 */
--glass-bg: #ffffff;
--glass-border: rgba(0, 0, 0, 0.06);
--glass-hover: #f8f9ff;
--glass-hover-border: rgba(99, 102, 241, 0.15);
--glass-border: rgba(0, 0, 0, 0.08);
--glass-hover: #f5f6ff;
--glass-hover-border: rgba(99, 102, 241, 0.2);
--glass-strong: #ffffff;
--glass-dim-bg: #f0f1ff;
--glass-dim-bg: #eef0ff;
/* 文字 — 高对比 */
--text-primary: #0a0a1a;
--text-secondary: rgba(10, 10, 26, 0.6);
--text-tertiary: rgba(10, 10, 26, 0.4);
--text-muted: rgba(10, 10, 26, 0.25);
--text-disabled: rgba(10, 10, 26, 0.15);
--text-primary: #0d0d1a;
--text-secondary: rgba(13, 13, 26, 0.65);
--text-tertiary: rgba(13, 13, 26, 0.45);
--text-muted: rgba(13, 13, 26, 0.28);
--text-disabled: rgba(13, 13, 26, 0.15);
/* 品牌色 — Indigo */
--color-brand: #6366f1;
--color-brand-light: #818cf8;
--color-brand-dark: #4f46e5;
--color-brand-bg: rgba(99, 102, 241, 0.06);
--color-brand-glow: rgba(99, 102, 241, 0.08);
--color-brand-bg: rgba(99, 102, 241, 0.08);
--color-brand-glow: rgba(99, 102, 241, 0.1);
/* 维度色 — 保持高饱和度，在白色背景上更鲜明 */
/* 维度色 — 加饱和度，更鲜明 */
--dim1-color: #6366f1;
--dim1-bg: rgba(99, 102, 241, 0.06);
--dim1-icon-bg: rgba(99, 102, 241, 0.12);
--dim1-border: rgba(99, 102, 241, 0.15);
--dim1-glow: rgba(99, 102, 241, 0.04);
--dim1-bg: rgba(99, 102, 241, 0.08);
--dim1-icon-bg: rgba(99, 102, 241, 0.14);
--dim1-border: rgba(99, 102, 241, 0.18);
--dim1-glow: rgba(99, 102, 241, 0.05);
--dim2-color: #0891b2;
--dim2-bg: rgba(8, 145, 178, 0.06);
--dim2-icon-bg: rgba(8, 145, 178, 0.12);
--dim2-border: rgba(8, 145, 178, 0.15);
--dim2-glow: rgba(8, 145, 178, 0.04);
--dim2-bg: rgba(8, 145, 178, 0.08);
--dim2-icon-bg: rgba(8, 145, 178, 0.14);
--dim2-border: rgba(8, 145, 178, 0.18);
--dim2-glow: rgba(8, 145, 178, 0.05);
--dim3-color: #059669;
--dim3-bg: rgba(5, 150, 105, 0.06);
--dim3-icon-bg: rgba(5, 150, 105, 0.12);
--dim3-border: rgba(5, 150, 105, 0.15);
--dim3-glow: rgba(5, 150, 105, 0.04);
--dim3-bg: rgba(5, 150, 105, 0.08);
--dim3-icon-bg: rgba(5, 150, 105, 0.14);
--dim3-border: rgba(5, 150, 105, 0.18);
--dim3-glow: rgba(5, 150, 105, 0.05);
--dim4-color: #d97706;
--dim4-bg: rgba(217, 119, 6, 0.06);
--dim4-icon-bg: rgba(217, 119, 6, 0.12);
--dim4-border: rgba(217, 119, 6, 0.15);
--dim4-glow: rgba(217, 119, 6, 0.04);
--dim4-bg: rgba(217, 119, 6, 0.08);
--dim4-icon-bg: rgba(217, 119, 6, 0.14);
--dim4-border: rgba(217, 119, 6, 0.18);
--dim4-glow: rgba(217, 119, 6, 0.05);
--dim5-color: #dc2626;
--dim5-bg: rgba(220, 38, 38, 0.06);
--dim5-icon-bg: rgba(220, 38, 38, 0.12);
--dim5-border: rgba(220, 38, 38, 0.15);
--dim5-glow: rgba(220, 38, 38, 0.04);
--dim5-bg: rgba(220, 38, 38, 0.08);
--dim5-icon-bg: rgba(220, 38, 38, 0.14);
--dim5-border: rgba(220, 38, 38, 0.18);
--dim5-glow: rgba(220, 38, 38, 0.05);
/* 功能色 */
--color-free: #059669;
--color-free-bg: rgba(5, 150, 105, 0.08);
--color-free-bg: rgba(5, 150, 105, 0.1);
--color-pro: #d97706;
--color-pro-bg: rgba(217, 119, 6, 0.08);
--color-pro-bg: rgba(217, 119, 6, 0.1);
--color-vip: #dc2626;
--color-vip-bg: rgba(220, 38, 38, 0.08);
--color-vip-bg: rgba(220, 38, 38, 0.1);
--color-hot: #dc2626;
--color-hot-bg: rgba(220, 38, 38, 0.1);
--color-hot-bg: rgba(220, 38, 38, 0.12);
--color-new: #0891b2;
--color-new-bg: rgba(8, 145, 178, 0.1);
--color-new-bg: rgba(8, 145, 178, 0.12);
--color-pick: #6366f1;
--color-pick-bg: rgba(99, 102, 241, 0.1);
--color-pick-bg: rgba(99, 102, 241, 0.12);
/* 圆角/间距/过渡 */
--radius-sm: 8px;
@@ -161,12 +161,12 @@ page, .theme-light {
--blur-bg: 20px;
--transition-fast: 0.2s ease;
--transition-normal: 0.3s ease;
--glow-brand: 0 0 20px rgba(99, 102, 241, 0.06);
--glow-brand-strong: 0 0 30px rgba(99, 102, 241, 0.1);
--glow-brand: 0 0 20px rgba(99, 102, 241, 0.08);
--glow-brand-strong: 0 0 30px rgba(99, 102, 241, 0.12);
/* 亮色专属：卡片阴影 */
--card-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
--card-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.06);
--card-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03);
--card-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.08);
}
/* ---- 暗色模式 ---- */