修改主题色

2026-06-10 14:35:16 +08:00
parent 1e093a0688
commit 95c2ded69e
9 changed files with 155 additions and 37 deletions
@@ -57,6 +57,19 @@
    --gradient-sky: linear-gradient(180deg, #D6EEF8 0%, #E4F2FA 15%, #EEF6FB 30%, #F5FAFD 50%, #FAFCFE 70%, #FFFFFF 100%); /* 主页天空渐变 - 全局背景 */
    --gradient-subtle: linear-gradient(120deg, #F9FAFE 0%, #FFFFFF 100%);    /* 微弱渐变 - 增加细节精致度 */
    
+    /* ========== TabBar 配色（清新蓝调风格）========== */
+    /* 引用位置：components/TabBar.vue */
+    --tabbar-bg: rgba(200, 225, 238, 0.8);           /* TabBar背景色 - 半透明浅蓝色毛玻璃效果 */
+    --tabbar-shadow: rgba(120, 185, 215, 0.2);        /* TabBar阴影色 - 蓝色系柔和阴影 */
+    --tabbar-icon-inactive: gray;                       /* 未选中图标颜色 - 灰色 */
+    --tabbar-icon-active: #5A98B0;                     /* 选中图标颜色 - 蓝绿色 */
+    --tabbar-text-inactive: #8AABBB;                   /* 未选中文字颜色 - 浅灰蓝 */
+    --tabbar-text-active: #5A98B0;                     /* 选中文字颜色 - 蓝绿色（与图标一致） */
+    
+    /* ========== 通用蓝色系阴影（用于卡片、按钮等）========== */
+    /* 引用位置：components/index/RecommendCourses.vue, QuickEntry.vue, TodayRecommend.vue */
+    --shadow-blue-light: rgba(120, 185, 215, 0.18);    /* 浅蓝色阴影 - 卡片悬浮效果 */
+    
    /* ========== 阴影层级 ========== */
    --shadow-sm: 0 8px 20px rgba(0, 0, 0, 0.03), 0 2px 6px rgba(0, 0, 0, 0.05);   /* 卡片小阴影 轻量浮起 */
    --shadow-md: 0 12px 28px rgba(0, 0, 0, 0.08);                                /* 中等阴影 - 弹窗或下拉菜单 */