From 8e8e3d5da2d37cd110f83279a58f91ee2c783e84 Mon Sep 17 00:00:00 2001 From: Yuzhiran Dev Date: Sat, 11 Jul 2026 17:13:52 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BA=AE=E8=89=B2=E4=B8=BB=E9=A2=98-?= =?UTF-8?q?=E5=8A=A0=E6=B7=B1=E8=83=8C=E6=99=AF=E5=B1=82=E6=AC=A1=E6=84=9F?= =?UTF-8?q?+=E5=8A=A0=E5=A4=A7=E9=A5=B1=E5=92=8C=E5=BA=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/App.vue | 96 ++++++++++++++++++------------------ client/src/pages.json | 12 ++--- client/src/styles/theme.scss | 2 +- 3 files changed, 55 insertions(+), 55 deletions(-) diff --git a/client/src/App.vue b/client/src/App.vue index 6805314..43c8df9 100644 --- a/client/src/App.vue +++ b/client/src/App.vue @@ -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); } /* ---- 暗色模式 ---- */ diff --git a/client/src/pages.json b/client/src/pages.json index da354c9..edd1b22 100644 --- a/client/src/pages.json +++ b/client/src/pages.json @@ -20,16 +20,16 @@ "globalStyle": { "navigationBarTextStyle": "black", "navigationBarTitleText": "宇之然AI维度", - "navigationBarBackgroundColor": "#f8f9fc", - "backgroundColor": "#f8f9fc", - "backgroundColorTop": "#f8f9fc", - "backgroundColorBottom": "#f8f9fc", + "navigationBarBackgroundColor": "#edeff3", + "backgroundColor": "#edeff3", + "backgroundColorTop": "#edeff3", + "backgroundColorBottom": "#edeff3", "app-plus": { - "background": "#f8f9fc" + "background": "#edeff3" } }, "tabBar": { - "color": "rgba(0,0,0,0.3)", + "color": "rgba(0,0,0,0.35)", "selectedColor": "#6366f1", "backgroundColor": "#ffffff", "borderStyle": "white", diff --git a/client/src/styles/theme.scss b/client/src/styles/theme.scss index 4a20567..9889d33 100644 --- a/client/src/styles/theme.scss +++ b/client/src/styles/theme.scss @@ -12,7 +12,7 @@ /* ---- SCSS 变量（方便组件内使用） ---- */ $color-brand: #6366f1; $color-brand-light: #818cf8; -$color-bg-primary: #f8f9fc; +$color-bg-primary: #edeff3; $color-bg-dark: #14141e; $dim1-color: #6366f1;