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

fix: 亮色主题全新配色(蓝紫)+趋势筛选换行+所有页面硬编码替换为CSS变量

Browse Source
This commit is contained in:
Yuzhiran Dev
2026-07-11 16:48:04 +08:00
parent 8149d2a93c
commit 8b06017d02
11 changed files with 131 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/App.vue
+84 -84
View File
@@ -47,16 +47,16 @@ function applyTabBarTheme(theme) {
try {
if (theme === 'dark') {
uni.setTabBarStyle({
color: 'rgba(255,255,255,0.25)',
selectedColor: '#b388ff',
backgroundColor: '#08080f',
color: 'rgba(255,255,255,0.35)',
selectedColor: '#a78bfa',
backgroundColor: '#0d0d1a',
borderStyle: 'black'
})
} else {
uni.setTabBarStyle({
color: 'rgba(0,0,0,0.35)',
selectedColor: '#7c4dff',
backgroundColor: '#ffffff',
color: 'rgba(99,102,241,0.4)',
selectedColor: '#6366f1',
backgroundColor: '#f0f2f8',
borderStyle: 'white'
})
}
@@ -69,82 +69,82 @@ function applyTabBarTheme(theme) {
<style>
/* ============================================
宇之然AI维度 — 全局主题
默认：亮色模式 | .theme-dark：暗色模式
默认：亮色模式（蓝紫主题） | .theme-dark：暗色模式
============================================ */
/* ---- 亮色模式（默认） ---- */
/* ---- 亮色模式（默认：蓝紫科技主题） ---- */
page, .theme-light {
/* 基础色 — 清爽浅灰 */
--bg-primary: #f5f5f7;
--bg-secondary: #ffffff;
--bg-tertiary: #e8e8ed;
/* 基础色 — 蓝紫科技灰 */
--bg-primary: #f0f2f8;
--bg-secondary: #f5f6fb;
--bg-tertiary: #e8eaf3;
/* 玻璃拟态 */
--glass-bg: rgba(255, 255, 255, 0.7);
--glass-border: rgba(0, 0, 0, 0.06);
--glass-hover: rgba(255, 255, 255, 0.85);
--glass-hover-border: rgba(0, 0, 0, 0.1);
--glass-strong: rgba(255, 255, 255, 0.9);
--glass-dim-bg: rgba(139, 92, 246, 0.05);
/* 玻璃拟态 — 蓝紫玻璃 */
--glass-bg: rgba(99, 102, 241, 0.05);
--glass-border: rgba(99, 102, 241, 0.1);
--glass-hover: rgba(99, 102, 241, 0.08);
--glass-hover-border: rgba(99, 102, 241, 0.15);
--glass-strong: rgba(99, 102, 241, 0.08);
--glass-dim-bg: rgba(99, 102, 241, 0.03);
/* 文字 */
--text-primary: rgba(0, 0, 0, 0.88);
--text-secondary: rgba(0, 0, 0, 0.55);
--text-tertiary: rgba(0, 0, 0, 0.4);
--text-muted: rgba(0, 0, 0, 0.25);
--text-disabled: rgba(0, 0, 0, 0.2);
/* 文字 — 深色高对比 */
--text-primary: #1a1a2e;
--text-secondary: rgba(26, 26, 46, 0.65);
--text-tertiary: rgba(26, 26, 46, 0.45);
--text-muted: rgba(26, 26, 46, 0.28);
--text-disabled: rgba(26, 26, 46, 0.18);
/* 品牌色 */
--color-brand: #7c4dff;
--color-brand-light: #b388ff;
--color-brand-dark: #651fff;
--color-brand-bg: rgba(124, 77, 255, 0.08);
--color-brand-glow: rgba(124, 77, 255, 0.12);
/* 品牌色 — 蓝紫 */
--color-brand: #6366f1;
--color-brand-light: #818cf8;
--color-brand-dark: #4f46e5;
--color-brand-bg: rgba(99, 102, 241, 0.08);
--color-brand-glow: rgba(99, 102, 241, 0.1);
/* 维度色 */
--dim1-color: #7c4dff;
--dim1-bg: rgba(124, 77, 255, 0.08);
--dim1-icon-bg: rgba(124, 77, 255, 0.15);
--dim1-border: rgba(124, 77, 255, 0.15);
--dim1-glow: rgba(124, 77, 255, 0.06);
/* 维度色 — 保持可识别性，亮色模式加饱和度 */
--dim1-color: #6366f1;
--dim1-bg: rgba(99, 102, 241, 0.08);
--dim1-icon-bg: rgba(99, 102, 241, 0.14);
--dim1-border: rgba(99, 102, 241, 0.16);
--dim1-glow: rgba(99, 102, 241, 0.05);
--dim2-color: #0ea5e9;
--dim2-bg: rgba(14, 165, 233, 0.08);
--dim2-icon-bg: rgba(14, 165, 233, 0.15);
--dim2-border: rgba(14, 165, 233, 0.15);
--dim2-glow: rgba(14, 165, 233, 0.06);
--dim2-color: #0891b2;
--dim2-bg: rgba(8, 145, 178, 0.08);
--dim2-icon-bg: rgba(8, 145, 178, 0.14);
--dim2-border: rgba(8, 145, 178, 0.16);
--dim2-glow: rgba(8, 145, 178, 0.05);
--dim3-color: #10b981;
--dim3-bg: rgba(16, 185, 129, 0.08);
--dim3-icon-bg: rgba(16, 185, 129, 0.15);
--dim3-border: rgba(16, 185, 129, 0.15);
--dim3-glow: rgba(16, 185, 129, 0.06);
--dim3-color: #059669;
--dim3-bg: rgba(5, 150, 105, 0.08);
--dim3-icon-bg: rgba(5, 150, 105, 0.14);
--dim3-border: rgba(5, 150, 105, 0.16);
--dim3-glow: rgba(5, 150, 105, 0.05);
--dim4-color: #f59e0b;
--dim4-bg: rgba(245, 158, 11, 0.08);
--dim4-icon-bg: rgba(245, 158, 11, 0.15);
--dim4-border: rgba(245, 158, 11, 0.15);
--dim4-glow: rgba(245, 158, 11, 0.06);
--dim4-color: #d97706;
--dim4-bg: rgba(217, 119, 6, 0.08);
--dim4-icon-bg: rgba(217, 119, 6, 0.14);
--dim4-border: rgba(217, 119, 6, 0.16);
--dim4-glow: rgba(217, 119, 6, 0.05);
--dim5-color: #ef4444;
--dim5-bg: rgba(239, 68, 68, 0.08);
--dim5-icon-bg: rgba(239, 68, 68, 0.15);
--dim5-border: rgba(239, 68, 68, 0.15);
--dim5-glow: rgba(239, 68, 68, 0.06);
--dim5-color: #dc2626;
--dim5-bg: rgba(220, 38, 38, 0.08);
--dim5-icon-bg: rgba(220, 38, 38, 0.14);
--dim5-border: rgba(220, 38, 38, 0.16);
--dim5-glow: rgba(220, 38, 38, 0.05);
/* 功能色 */
--color-free: #10b981;
--color-free-bg: rgba(16, 185, 129, 0.1);
--color-pro: #f59e0b;
--color-pro-bg: rgba(245, 158, 11, 0.1);
--color-vip: #ef4444;
--color-vip-bg: rgba(239, 68, 68, 0.1);
--color-hot: #ef4444;
--color-hot-bg: rgba(239, 68, 68, 0.12);
--color-new: #0ea5e9;
--color-new-bg: rgba(14, 165, 233, 0.12);
--color-pick: #7c4dff;
--color-pick-bg: rgba(124, 77, 255, 0.12);
--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);
/* 圆角/间距/过渡 */
--radius-sm: 8px;
@@ -161,8 +161,8 @@ page, .theme-light {
--blur-bg: 20px;
--transition-fast: 0.2s ease;
--transition-normal: 0.3s ease;
--glow-brand: 0 0 20px rgba(124, 77, 255, 0.08);
--glow-brand-strong: 0 0 30px rgba(124, 77, 255, 0.12);
--glow-brand: 0 0 20px rgba(99, 102, 241, 0.08);
--glow-brand-strong: 0 0 30px rgba(99, 102, 241, 0.12);
}
/* ---- 暗色模式 ---- */
@@ -177,7 +177,7 @@ page, .theme-light {
--glass-hover: rgba(255, 255, 255, 0.1);
--glass-hover-border: rgba(255, 255, 255, 0.15);
--glass-strong: rgba(255, 255, 255, 0.12);
--glass-dim-bg: rgba(124, 77, 255, 0.06);
--glass-dim-bg: rgba(99, 102, 241, 0.06);
--text-primary: rgba(255, 255, 255, 0.95);
--text-secondary: rgba(255, 255, 255, 0.7);
@@ -185,17 +185,17 @@ page, .theme-light {
--text-muted: rgba(255, 255, 255, 0.3);
--text-disabled: rgba(255, 255, 255, 0.15);
--color-brand: #8b5cf6;
--color-brand-light: #a78bfa;
--color-brand-dark: #7c3aed;
--color-brand-bg: rgba(139, 92, 246, 0.12);
--color-brand-glow: rgba(139, 92, 246, 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);
--dim1-color: #a78bfa;
--dim1-bg: rgba(139, 92, 246, 0.12);
--dim1-icon-bg: rgba(139, 92, 246, 0.2);
--dim1-border: rgba(139, 92, 246, 0.18);
--dim1-glow: rgba(139, 92, 246, 0.08);
--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);
--dim2-color: #60a5fa;
--dim2-bg: rgba(96, 165, 250, 0.12);
@@ -232,10 +232,10 @@ page, .theme-light {
--color-new: #60a5fa;
--color-new-bg: rgba(96, 165, 250, 0.15);
--color-pick: #a78bfa;
--color-pick-bg: rgba(139, 92, 246, 0.15);
--color-pick-bg: rgba(99, 102, 241, 0.15);
--glow-brand: 0 0 20px rgba(139, 92, 246, 0.1);
--glow-brand-strong: 0 0 30px rgba(139, 92, 246, 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);
}
/* 全局排版 */