From 351a049610322ffbcc12e5e412186498f2ee12d4 Mon Sep 17 00:00:00 2001
From: obroccolio <jinjunxiang@hnu.edu.cn>
Date: Fri, 7 Aug 2026 15:16:24 +0800
Subject: [PATCH] feat: update global tokens and remove legacy decorations

---
 src/app.config.ts |   8 +-
 src/app.scss      | 189 +++++++++++++++++++++++++---------------------
 src/theme.json    |  18 ++---
 3 files changed, 114 insertions(+), 101 deletions(-)

diff --git a/src/app.config.ts b/src/app.config.ts
index a50a21f..c53298b 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -27,10 +27,10 @@ export default defineAppConfig({
     navigationStyle: 'custom',
     // 顶部/窗口颜色先显式固定为小程序浅色主题，避免 iOS 顶部区域跟随系统深色；
     // 应用启动后页面 Hook 会按小程序内主题实时覆盖上面的值。
-    navigationBarBackgroundColor: '#ffffff',
-    backgroundColor: '#ffffff',
-    backgroundColorTop: '#ffffff',
-    backgroundColorBottom: '#ffffff',
+    navigationBarBackgroundColor: '#faf7f2',
+    backgroundColor: '#faf7f2',
+    backgroundColorTop: '#faf7f2',
+    backgroundColorBottom: '#faf7f2',
     // 状态栏文字默认黑字；各页面 useStatusBar 会按小程序主题覆盖它。
     navigationBarTextStyle: 'black',
   },
diff --git a/src/app.scss b/src/app.scss
index 678ab5b..4a6e0a6 100644
--- a/src/app.scss
+++ b/src/app.scss
@@ -20,33 +20,61 @@
 
 /* 变量定义 */
 .theme-light {
-  --bg-page: #ffffff;
-  --line-card: 3px dashed #ffb7c5;
-  --line-star: #ffb7c5;
-  --text-primary: #5c3a3a;
-  --text-secondary: #b08d8d;
-  --text-muted: #d28a8a;
-  --accent-pink: #ff9a9e;
-  --accent-blue: #5b8cff;
-  --btn-gradient: linear-gradient(135deg, #ff9a9e 0%, #fecfef 99%);
-  --shadow-card: 0 8px 24px rgba(255, 154, 158, 0.12);
-  --bg-input: #f8f9fa;
+  --bg-page: #faf7f2;
   --bg-card: #ffffff;
+  --bg-muted: #f3eee7;
+  --bg-input: #f5f1eb;
+  --text-primary: #2e2622;
+  --text-secondary: #8a7e76;
+  --text-muted: #b3a89e;
+  --accent-primary: #d96c6a;
+  --accent-primary-strong: #c75b59;
+  --accent-primary-soft: #f6e0dc;
+  --accent-secondary: #6c7bdb;
+  --accent-secondary-soft: rgba(108, 123, 219, 0.12);
+  --success: #4fa477;
+  --warning: #d99a4e;
+  --danger: #d85d5d;
+  --border: #ede5dc;
+  --border-strong: #e0d5c8;
+  --glass: rgba(255, 255, 255, 0.72);
+  --glass-line: rgba(255, 255, 255, 0.55);
+  --shadow-card: 0 8rpx 24rpx rgba(46, 38, 34, 0.08);
+  --shadow-elevated: 0 12rpx 40rpx rgba(46, 38, 34, 0.12);
+  --line-card: 1rpx solid var(--border);
+  --line-star: var(--border);
+  --accent-pink: var(--accent-primary);
+  --accent-blue: var(--accent-secondary);
+  --btn-gradient: var(--accent-primary);
 }
 
 .theme-dark {
   --bg-page: #191919;
-  --line-card: 3px dashed #5b8cff;
-  --line-star: #5b8cff;
-  --text-primary: #e6e6e6;
-  --text-secondary: #999999;
-  --text-muted: #737373;
-  --accent-pink: #ff7eb3;
-  --accent-blue: #5cadff;
-  --btn-gradient: linear-gradient(135deg, #ff7eb3 0%, #7a5cff 100%);
-  --shadow-card: 0 8px 24px rgba(0, 0, 0, 0.3);
-  --bg-input: #232323;
-  --bg-card: #232323;
+  --bg-card: #23201d;
+  --bg-muted: #2b2622;
+  --bg-input: #2b2622;
+  --text-primary: #f5efe8;
+  --text-secondary: #b3a79c;
+  --text-muted: #82766c;
+  --accent-primary: #f09198;
+  --accent-primary-strong: #ffa7ad;
+  --accent-primary-soft: rgba(240, 145, 152, 0.14);
+  --accent-secondary: #8e97e8;
+  --accent-secondary-soft: rgba(142, 151, 232, 0.14);
+  --success: #67c58e;
+  --warning: #e0ad68;
+  --danger: #ef7a7a;
+  --border: #37312c;
+  --border-strong: #463e37;
+  --glass: rgba(25, 25, 25, 0.72);
+  --glass-line: rgba(255, 255, 255, 0.14);
+  --shadow-card: 0 8rpx 24rpx rgba(0, 0, 0, 0.32);
+  --shadow-elevated: 0 12rpx 40rpx rgba(0, 0, 0, 0.48);
+  --line-card: 1rpx solid var(--border);
+  --line-star: var(--border);
+  --accent-pink: var(--accent-primary);
+  --accent-blue: var(--accent-secondary);
+  --btn-gradient: var(--accent-primary);
 }
 
 /* page 基础字体 */
@@ -58,41 +86,16 @@ page {
    全局组件样式
    ========================================================== */
 
-.dashed-card {
+.surface-card {
   background: var(--bg-card);
-  border: var(--line-card);
-  border-radius: 24px;
-  padding: 32px;
-  position: relative;
-  overflow: hidden;
+  border: 1rpx solid var(--border);
+  border-radius: 24rpx;
   box-shadow: var(--shadow-card);
 }
 
-/* 虚线无填充星星（左上角装饰） */
-.star-badge {
-  position: absolute;
-  top: -10px;
-  left: -10px;
-  width: 48px;
-  height: 48px;
-  z-index: 2;
-}
-
-.star-badge::before {
-  content: '';
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  width: 32px;
-  height: 32px;
-  background: var(--bg-card);
-  clip-path: polygon(
-    50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
-    50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%
-  );
-  border: 2px dashed var(--line-star);
-  box-sizing: border-box;
+/* 为兼容旧页面中的卡片类名，保留过渡别名 */
+.dashed-card {
+  @extend .surface-card;
 }
 
 /* === 常用工具类 === */
@@ -111,37 +114,36 @@ page {
 .mb-20 { margin-bottom: 20px; }
 
 /* === 通用按钮 === */
-.btn-gradient {
-  background: var(--btn-gradient);
+.btn-primary {
+  background: var(--accent-primary);
+  color: #fff;
+  border-radius: 999rpx;
+}
+
+.btn-secondary {
+  background: var(--bg-card);
   color: var(--text-primary);
-  border-radius: 50px;
-  padding: 24px 48px;
-  font-size: 32px;
-  font-weight: 600;
-  text-align: center;
-  box-shadow: 0 8px 24px rgba(255, 154, 158, 0.25);
-  border: none;
+  border: 1rpx solid var(--border-strong);
+  border-radius: 999rpx;
 }
 
-.theme-dark .btn-gradient {
-  color: #ffffff;
-  box-shadow: 0 8px 24px rgba(122, 92, 255, 0.3);
+.btn-ghost {
+  background: transparent;
+  color: var(--accent-primary);
 }
 
-.btn-gradient:active {
-  opacity: 0.9;
-  transform: scale(0.98);
+.btn-danger {
+  background: var(--danger);
+  color: #fff;
+  border-radius: 999rpx;
+}
+
+.btn-gradient {
+  @extend .btn-primary;
 }
 
 .btn-outline {
-  background: var(--bg-card);
-  color: var(--accent-blue);
-  border: var(--line-card);
-  border-radius: 50px;
-  padding: 20px 48px;
-  font-size: 28px;
-  font-weight: 500;
-  text-align: center;
+  @extend .btn-secondary;
 }
 
 /* 固定底部操作栏 */
@@ -150,15 +152,16 @@ page {
   bottom: 0;
   left: 0;
   right: 0;
-  background: var(--bg-card);
-  border-top: var(--line-card);
-  padding: 20px 32px calc(20px + env(safe-area-inset-bottom));
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
+  padding: 20px 32px calc(20px + env(safe-area-inset-bottom));
+  background: rgba(255, 255, 255, 0.55);
+  backdrop-filter: blur(32px) saturate(1.2);
+  -webkit-backdrop-filter: blur(32px) saturate(1.2);
+  border-top: 1rpx solid var(--glass-line);
   z-index: 500;
-  box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.08);
 }
 
 /* === 标题文字 === */
@@ -187,22 +190,32 @@ page {
 }
 
 .badge-pink {
-  background: rgba(255, 154, 158, 0.15);
-  color: var(--accent-pink);
+  background: var(--accent-primary-soft);
+  color: var(--accent-primary);
 }
 
 .badge-blue {
-  background: rgba(160, 196, 255, 0.15);
-  color: var(--accent-blue);
+  background: var(--accent-secondary-soft);
+  color: var(--accent-secondary);
 }
 
 .badge-green {
-  background: rgba(139, 211, 161, 0.15);
-  color: #2ecc71;
+  background: rgba(79, 164, 119, 0.14);
+  color: var(--success);
+}
+
+.badge-warning {
+  background: rgba(217, 154, 78, 0.14);
+  color: var(--warning);
+}
+
+.badge-danger {
+  background: rgba(216, 93, 93, 0.14);
+  color: var(--danger);
 }
 
 .badge-gray {
-  background: rgba(128, 128, 128, 0.15);
+  background: var(--bg-muted);
   color: var(--text-secondary);
 }
 
@@ -213,7 +226,7 @@ page {
 }
 
 .safe-bottom-placeholder {
-  height: 160px;
+  height: 200px;
 }
 
 /* === 自定义导航栏安全区适配 === */
diff --git a/src/theme.json b/src/theme.json
index 8f6f539..950d6ba 100644
--- a/src/theme.json
+++ b/src/theme.json
@@ -1,14 +1,14 @@
 {
   "light": {
-    "navBgColor": "#ffffff",
+    "navBgColor": "#faf7f2",
     "navTxtStyle": "black",
-    "bgColor": "#ffffff",
+    "bgColor": "#faf7f2",
     "bgTxtStyle": "dark",
-    "bgColorTop": "#ffffff",
-    "bgColorBottom": "#ffffff",
-    "tabBarColor": "#b08d8d",
-    "tabBarSelectedColor": "#ff9a9e",
-    "tabBarBgColor": "#ffffff",
+    "bgColorTop": "#faf7f2",
+    "bgColorBottom": "#faf7f2",
+    "tabBarColor": "#8a7e76",
+    "tabBarSelectedColor": "#d96c6a",
+    "tabBarBgColor": "#faf7f2",
     "tabBarBorderStyle": "black"
   },
   "dark": {
@@ -18,8 +18,8 @@
     "bgTxtStyle": "light",
     "bgColorTop": "#191919",
     "bgColorBottom": "#191919",
-    "tabBarColor": "#999999",
-    "tabBarSelectedColor": "#ff7eb3",
+    "tabBarColor": "#b3a79c",
+    "tabBarSelectedColor": "#f09198",
     "tabBarBgColor": "#191919",
     "tabBarBorderStyle": "white"
   }