xiaoyu/txw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: qych 三专题配色重设计——按内容调性区分蓝/青/绿

Browse Source 
电池法案→蓝色系(工业/技术/精密): #e9f0fe header, #e4edfb→#c8d6f0 card
CBAM→青色系(金融/贸易/国际): #e6f5f2 header, #dfeee9→#c0ddd2 card
航运燃料→蓝绿系(海洋/物流/可持续): #e6f4f0 header, #dff0ea→#c0e0d7 card
section 背景各行极淡底色 (#f7f9fc/#f6faf9/#f5faf8)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
liulujian 2026-07-05 00:30:29 +08:00
parent 7ea4a9ae38
commit c0c8534fc6
2 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
txw-mhzc-web/src/pages/index/styles/home-figma-variables.less
View File

@ -1173,16 +1173,20 @@ html.portal-figma-scale-active.portal-market-figma-scale-active {
@qych-policy-btn-size: 14px;
@qych-policy-btn-height: 32px;
@qych-policy-btn-radius: 3px;
// 电池法案：绿色系
@qych-policy-header-gradient-battery: linear-gradient(180deg, #eaf5ec 0%, #f5faf6 52.885%, #fff 100%);
@qych-policy-header-gradient-cbam: linear-gradient(180deg, #eaf7f5 0%, #f5faf9 52.885%, #fff 100%);
@qych-policy-header-gradient-shipping: linear-gradient(180deg, #e5f2f0 0%, #f4f9f8 52.885%, #fff 100%);
@qych-policy-card-gradient-battery-1: linear-gradient(180deg, #edf4e9 0%, #dce9d8 100%);
@qych-policy-card-gradient-battery-2: linear-gradient(180deg, #e3f0e6 0%, #d0e2d3 100%);
@qych-policy-card-gradient-cbam-1: linear-gradient(180deg, #edf6f2 0%, #d8ebe3 100%);
@qych-policy-card-gradient-cbam-2: linear-gradient(180deg, #e5f3ef 0%, #cee6de 100%);
@qych-policy-card-gradient-shipping-1: linear-gradient(180deg, #eef7f2 0%, #dbece2 100%);
@qych-policy-card-gradient-shipping-2: linear-gradient(180deg, #e2f0ec 0%, #cde3dc 100%);
// ── 电池法案：蓝色系（工业 / 技术 / 精密）──
@qych-policy-header-gradient-battery: linear-gradient(180deg, #e9f0fe 0%, #f4f7ff 52.885%, #fff 100%);
@qych-policy-card-gradient-battery-1: linear-gradient(180deg, #e4edfb 0%, #c8d6f0 100%);
@qych-policy-card-gradient-battery-2: linear-gradient(180deg, #eef3fc 0%, #d8e2f5 100%);
// ── CBAM：青色系（金融 / 贸易 / 国际）──
@qych-policy-header-gradient-cbam: linear-gradient(180deg, #e6f5f2 0%, #f2faf8 52.885%, #fff 100%);
@qych-policy-card-gradient-cbam-1: linear-gradient(180deg, #dfeee9 0%, #c0ddd2 100%);
@qych-policy-card-gradient-cbam-2: linear-gradient(180deg, #e9f3ef 0%, #d0e5dd 100%);
// ── 航运燃料：蓝绿色系（海洋 / 物流 / 可持续）──
@qych-policy-header-gradient-shipping: linear-gradient(180deg, #e6f4f0 0%, #f2f9f7 52.885%, #fff 100%);
@qych-policy-card-gradient-shipping-1: linear-gradient(180deg, #dff0ea 0%, #c0e0d7 100%);
@qych-policy-card-gradient-shipping-2: linear-gradient(180deg, #eaf5f1 0%, #d2e8e1 100%);
@qych-policy-card-min-height: 164px;
@qych-policy-card-icon-right: 30px;
@qych-policy-card-icon-opacity: 0.3;

10
txw-mhzc-web/src/pages/index/views/qych/index.vue
View File

@ -1159,11 +1159,9 @@ body {
padding-top: 24px;
}
.banner1.qych-snap-section,
.banner2.qych-snap-section,
.banner3.qych-snap-section {
--qych-section-bg: #f6f7fa;
}
.banner1.qych-snap-section { --qych-section-bg: #f7f9fc; }
.banner2.qych-snap-section { --qych-section-bg: #f6faf9; }
.banner3.qych-snap-section { --qych-section-bg: #f5faf8; }
.banner1 {
background: url(../../assets/qych/banner3.png);
@ -1171,7 +1169,7 @@ body {
background-position: center top;
}
.banner2 {
background: #f6f7fa;
background: #f6faf9;
}
.banner3 {
background: url(../../assets/qych/banner1.png);