Procházet zdrojové kódy

refactor(mind-detail): B-1e emotion-report 令牌化——38 处硬编码色收敛(零观感变化)

- 全全局映射、零局部调色板:EQ 四级 ramp 前景落 $status-success/
  $status-info/$brand-primary/$status-danger,浅底落 §16 新登 6 枚
  (emerald-50/blue-50/red-50/gold/描边灰/深夜蓝黑,均全库 3~46 文件复用)
- 验证:等价回归 PASS(编译产物逐字节相同)、零残留 hex
liaoxg před 1 týdnem
rodič
revize
15665f144d
1 změnil soubory, kde provedl 32 přidání a 32 odebrání
  1. 32 32
      cfc-frontend/pages/mind-detail/emotion-report.vue

+ 32 - 32
cfc-frontend/pages/mind-detail/emotion-report.vue

@@ -163,17 +163,17 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .container {
   min-height: 100vh;
-  background: #f5f7fa;
+  background: $app-bg;
   padding-bottom: 120rpx;
 }
 
 /* ===== 报告卡 ===== */
 .report-card {
   margin: 20rpx 30rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 24rpx;
   padding: 40rpx;
   box-shadow: 0 4rpx 20rpx rgba(0,0,0,0.06);
@@ -190,12 +190,12 @@ export default {
 .report-title {
   font-size: 36rpx;
   font-weight: bold;
-  color: #333;
+  color: $facade-text-strong;
 }
 
 .report-date {
   font-size: 24rpx;
-  color: #999;
+  color: $facade-text-muted;
 }
 
 /* ===== 综合EQ ===== */
@@ -204,10 +204,10 @@ export default {
   flex-direction: column;
   align-items: center;
   padding: 40rpx 0;
-  background: linear-gradient(135deg, #FF6B35, #FFD700);
+  background: linear-gradient(135deg, $mind-accent, $accent-gold);
   border-radius: 20rpx;
   margin-bottom: 40rpx;
-  color: #fff;
+  color: $app-surface;
 }
 
 .overall-label {
@@ -259,7 +259,7 @@ export default {
 
 .dimension-name {
   font-size: 28rpx;
-  color: #333;
+  color: $facade-text-strong;
   font-weight: 500;
 }
 
@@ -272,7 +272,7 @@ export default {
 .dimension-score {
   font-size: 32rpx;
   font-weight: bold;
-  color: #FF6B35;
+  color: $mind-accent;
   margin-right: 12rpx;
 }
 
@@ -282,14 +282,14 @@ export default {
   border-radius: 12rpx;
 }
 
-.level-excellent { color: #10B981; background: #ECFDF5; }
-.level-good { color: #3B82F6; background: #EFF6FF; }
-.level-average { color: #F97316; background: #FFF7ED; }
-.level-low { color: #EF4444; background: #FEF2F2; }
+.level-excellent { color: $status-success; background: $status-success-tint; }
+.level-good { color: $status-info; background: $status-info-tint; }
+.level-average { color: $brand-primary; background: $facade-brand-tint; }
+.level-low { color: $status-danger; background: $status-danger-tint-2; }
 
 .dimension-bar {
   height: 18rpx;
-  background: #f0f0f0;
+  background: $facade-fill;
   border-radius: 9rpx;
   overflow: hidden;
   margin-bottom: 8rpx;
@@ -303,7 +303,7 @@ export default {
 
 .dimension-desc {
   font-size: 22rpx;
-  color: #999;
+  color: $facade-text-muted;
   line-height: 1.4;
 }
 
@@ -311,12 +311,12 @@ export default {
 .section-card {
   margin-top: 30rpx;
   padding: 28rpx;
-  background: #f9f9f9;
+  background: $facade-fill-ghost-2;
   border-radius: 16rpx;
 }
 
 .suggestion-card {
-  background: #FFFBEB;
+  background: $dim-wealth-tint;
 }
 
 .section-header-row {
@@ -334,12 +334,12 @@ export default {
 .section-title {
   font-size: 30rpx;
   font-weight: bold;
-  color: #333;
+  color: $facade-text-strong;
 }
 
 .section-content {
   font-size: 26rpx;
-  color: #666;
+  color: $facade-text-body;
   line-height: 1.7;
   display: block;
 }
@@ -362,25 +362,25 @@ export default {
 }
 
 .action-btn.primary {
-  background: linear-gradient(135deg, #FF6B35, #FFD700);
+  background: linear-gradient(135deg, $mind-accent, $accent-gold);
   margin-left: 16rpx;
   box-shadow: 0 4rpx 16rpx rgba(255,107,53,0.3);
 }
 
 .action-btn.secondary {
-  background: #fff;
-  border: 2rpx solid #ddd;
+  background: $app-surface;
+  border: 2rpx solid $facade-border-soft;
   margin-right: 16rpx;
 }
 
 .action-btn-text {
   font-size: 28rpx;
   font-weight: 500;
-  color: #fff;
+  color: $app-surface;
 }
 
 .action-btn.secondary .action-btn-text {
-  color: #666;
+  color: $facade-text-body;
 }
 
 /* ===== 推荐卡片 ===== */
@@ -398,9 +398,9 @@ export default {
 .rec-card-left { display: flex; align-items: center; flex: 1; min-width: 0; }
 .rec-card-icon { font-size: 44rpx; margin-right: 16rpx; flex-shrink: 0; }
 .rec-card-info { flex: 1; min-width: 0; }
-.rec-card-title { font-size: 28rpx; font-weight: 600; color: #1a1a2e; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.rec-card-desc { font-size: 22rpx; color: #94a3b8; margin-top: 4rpx; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.rec-card-score { font-size: 28rpx; font-weight: 700; color: #FF6B35; flex-shrink: 0; margin-left: 16rpx; }
+.rec-card-title { font-size: 28rpx; font-weight: 600; color: $app-ink-night; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.rec-card-desc { font-size: 22rpx; color: $app-text-subtle; margin-top: 4rpx; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.rec-card-score { font-size: 28rpx; font-weight: 700; color: $mind-accent; flex-shrink: 0; margin-left: 16rpx; }
 
 /* ===== 加载中 ===== */
 .loading-state {
@@ -412,7 +412,7 @@ export default {
 
 .loading-text {
   font-size: 28rpx;
-  color: #999;
+  color: $facade-text-muted;
 }
 
 /* ===== 空状态 ===== */
@@ -430,22 +430,22 @@ export default {
 
 .empty-title {
   font-size: 32rpx;
-  color: #333;
+  color: $facade-text-strong;
   font-weight: bold;
   margin-bottom: 16rpx;
 }
 
 .empty-desc {
   font-size: 26rpx;
-  color: #999;
+  color: $facade-text-muted;
   text-align: center;
   line-height: 1.6;
   margin-bottom: 40rpx;
 }
 
 .empty-btn {
-  background: linear-gradient(135deg, #FF6B35, #FFD700);
-  color: #fff;
+  background: linear-gradient(135deg, $mind-accent, $accent-gold);
+  color: $app-surface;
   font-size: 28rpx;
   font-weight: bold;
   padding: 16rpx 64rpx;