Explorar o código

refactor(mind-detail): B-1j duo-compatibility 令牌化——26 处硬编码色收敛(零观感变化)

- 全全局映射、零局部调色板($facade-violet 系 5 / 文字阶 10 / 填充阶 6 /
  $status-success 1 / 暖灰浅底 1 / $app-surface 5)
- 脚本区五行/维度数据色为运行时驱动,按纪律不纳入 style 块令牌化
- 验证:等价回归 PASS(编译产物逐字节相同)、零残留 hex
liaoxg hai 1 semana
pai
achega
db88e2f565
Modificáronse 1 ficheiros con 26 adicións e 26 borrados
  1. 26 26
      cfc-frontend/pages/mind-detail/duo-compatibility.vue

+ 26 - 26
cfc-frontend/pages/mind-detail/duo-compatibility.vue

@@ -285,10 +285,10 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .duo-container {
   min-height: 100vh;
-  background: #F8F6F0;
+  background: $facade-fill-warm-tint;
   padding-bottom: 40rpx;
 }
 .loading-state {
@@ -296,11 +296,11 @@ export default {
   align-items: center;
   justify-content: center;
   padding: 120rpx 0;
-  color: #999;
+  color: $facade-text-muted;
   font-size: 28rpx;
 }
 .duo-header {
-  background: linear-gradient(135deg, #8B5CF6, #A78BFA);
+  background: linear-gradient(135deg, $facade-violet, $facade-violet-light);
   padding: 40rpx 32rpx;
   display: flex;
   align-items: center;
@@ -321,7 +321,7 @@ export default {
   justify-content: center;
   font-size: 36rpx;
   font-weight: 700;
-  color: #fff;
+  color: $app-surface;
   text-align: center;
   line-height: 88rpx;
 }
@@ -338,7 +338,7 @@ export default {
 .compatibility-score {
   font-size: 64rpx;
   font-weight: 800;
-  color: #fff;
+  color: $app-surface;
   line-height: 1;
 }
 .compatibility-label {
@@ -348,7 +348,7 @@ export default {
 }
 .dimension-summary {
   margin: 24rpx 32rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 20rpx;
   padding: 24rpx 28rpx;
   display: flex;
@@ -363,14 +363,14 @@ export default {
 .dimension-label {
   font-size: 24rpx;
   font-weight: 500;
-  color: #666;
+  color: $facade-text-body;
   width: 96rpx;
   flex-shrink: 0;
 }
 .dimension-bar-track {
   flex: 1;
   height: 16rpx;
-  background: #F0F0F0;
+  background: $facade-fill;
   border-radius: 8rpx;
   overflow: hidden;
 }
@@ -382,14 +382,14 @@ export default {
 .dimension-score {
   font-size: 24rpx;
   font-weight: 600;
-  color: #333;
+  color: $facade-text-strong;
   width: 56rpx;
   text-align: right;
 }
 .tab-bar {
   display: flex;
   margin: 0 32rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 20rpx 20rpx 0 0;
   overflow: hidden;
 }
@@ -398,23 +398,23 @@ export default {
   padding: 20rpx 0;
   text-align: center;
   font-size: 26rpx;
-  color: #999;
+  color: $facade-text-muted;
   border-bottom: 4rpx solid transparent;
 }
 .tab-active {
-  color: #8B5CF6;
-  border-bottom-color: #8B5CF6;
+  color: $facade-violet;
+  border-bottom-color: $facade-violet;
   font-weight: 600;
 }
 .tab-content {
   margin: 0 32rpx;
-  background: #fff;
+  background: $app-surface;
   border-radius: 0 0 20rpx 20rpx;
   padding: 28rpx;
 }
 .info-card {
   padding: 20rpx;
-  background: #FAFAFA;
+  background: $facade-fill-ghost;
   border-radius: 16rpx;
 }
 .info-row {
@@ -422,29 +422,29 @@ export default {
   justify-content: space-between;
   align-items: center;
   padding: 12rpx 0;
-  border-bottom: 1rpx solid #F0F0F0;
+  border-bottom: 1rpx solid $facade-fill;
 }
 .info-row:last-child {
   border-bottom: none;
 }
 .info-label {
   font-size: 26rpx;
-  color: #666;
+  color: $facade-text-body;
 }
 .info-value {
   font-size: 26rpx;
-  color: #333;
+  color: $facade-text-strong;
   font-weight: 500;
   text-align: right;
   max-width: 60%;
 }
 .score-high {
-  color: #10B981;
+  color: $status-success;
   font-weight: 700;
   font-size: 32rpx;
 }
 .score-primary {
-  color: #8B5CF6;
+  color: $facade-violet;
   font-weight: 700;
   font-size: 32rpx;
 }
@@ -477,7 +477,7 @@ export default {
 }
 .wuxing-bar-label {
   font-size: 20rpx;
-  color: #999;
+  color: $facade-text-muted;
   width: 60rpx;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -486,7 +486,7 @@ export default {
 .wuxing-bar-track-s {
   flex: 1;
   height: 12rpx;
-  background: #F0F0F0;
+  background: $facade-fill;
   border-radius: 6rpx;
   overflow: hidden;
 }
@@ -496,13 +496,13 @@ export default {
 }
 .wuxing-bar-val {
   font-size: 20rpx;
-  color: #666;
+  color: $facade-text-body;
   width: 36rpx;
   text-align: right;
 }
 .wuxing-card-desc {
   font-size: 22rpx;
-  color: #666;
+  color: $facade-text-body;
   margin-top: 8rpx;
   display: block;
 }
@@ -511,7 +511,7 @@ export default {
   align-items: center;
   justify-content: center;
   padding: 120rpx 0;
-  color: #999;
+  color: $facade-text-muted;
   font-size: 28rpx;
 }
 </style>