refactor(admin): 装饰性模型卡图标底复用 accent token 以暗黑反色
仪表盘模型卡/统计卡的 blue/amber/purple/teal/rose/indigo 图标底是纯装饰
多色强调(非语义状态),原用 raw bg-X-50 等 Solid 浅色,暗黑模式仍为浅色盒。
- 复用项目既有 accent 色组(bg-accent-{hue}-soft 透明浅色调 + text-accent-{hue}),
透明 soft 叠加暗黑页面底色即自动反色为深色底(与 products-content-v3 /
metric-card 既定模式一致)。
- tailwind.config.js + globals.css:accent 组补 rose/indigo 两色(DEFAULT + soft
+ rgb),blue/amber/teal/purple 已由既有 token 覆盖,无需新增。
验证:type-check 0 errors;lint 0 errors;单测 1624 passed;视觉回归 22 passed;
Playwright 实测新增 rose/indigo 变量接线正确,装饰框实际渲染色
浅 rgb(231,240,254) → 暗 rgb(16,28,47) 确认反色。
Co-Authored-By: 阿睿 <workbuddy@tencent.com>
This commit is contained in:
@@ -41,6 +41,10 @@ module.exports = {
|
||||
'purple-soft': 'var(--color-accent-purple-soft)',
|
||||
cyan: 'rgb(var(--color-accent-cyan-rgb) / <alpha-value>)',
|
||||
'cyan-soft': 'var(--color-accent-cyan-soft)',
|
||||
rose: 'rgb(var(--color-accent-rose-rgb) / <alpha-value>)',
|
||||
'rose-soft': 'var(--color-accent-rose-soft)',
|
||||
indigo: 'rgb(var(--color-accent-indigo-rgb) / <alpha-value>)',
|
||||
'indigo-soft': 'var(--color-accent-indigo-soft)',
|
||||
},
|
||||
bg: {
|
||||
primary: 'rgb(var(--color-bg-primary-rgb) / <alpha-value>)',
|
||||
|
||||
Reference in New Issue
Block a user