feat(theme): 暗黑模式 Phase 2 批次 3 — product-detail/standalone/detail-hero token 化
- product-detail-content-v3.tsx: 9 处 bg-white → bg-bg-primary (Hero / features / benefits / process / cases / certifications / CTA) - standalone/[id]/client.tsx: 5 处 bg-white → bg-bg-primary - detail-hero.tsx: 浅色 variant bg-white → bg-bg-primary(共享组件) - detail.test.tsx: 新增常驻断言——light variant 必须用主题 token,禁止硬编码 bg-white 验证(evidence-first): - type-check 0 / lint 0 errors - jest 128 suites / 1624 passed(含新增断言) - 视觉回归 22 passed(浅色基线零 diff) - computed-style 一次性验证 4 passed: /products/erp + /products/crm 的 dark 反色 (html/body/header → #0A0E14、section 层次自动反色)+ light 零深色残留;脚本已删 Phase 2 剩余批次: 批次 4 admin 全量(user 决策: admin 也参与)
This commit is contained in:
@@ -32,7 +32,7 @@ export function DetailHero({
|
||||
|
||||
const bgClass = isBrand
|
||||
? 'bg-brand-section text-white'
|
||||
: 'bg-white text-ink';
|
||||
: 'bg-bg-primary text-ink';
|
||||
|
||||
return (
|
||||
<section className={`relative min-h-[700px] flex items-center overflow-hidden ${bgClass}`}>
|
||||
|
||||
@@ -383,6 +383,21 @@ describe('DetailHero', () => {
|
||||
const section = container.querySelector('section');
|
||||
expect(section).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should use theme-aware bg token (not hard-coded bg-white) for light variant', async () => {
|
||||
const { DetailHero } = await import('./detail-hero');
|
||||
const { container } = render(
|
||||
<DetailHero
|
||||
theme={mockHeroTheme}
|
||||
title="ERP"
|
||||
subtitle="Expert"
|
||||
/>
|
||||
);
|
||||
// 暗黑模式:浅色底色必须走 CSS 变量 token,dark 下才能随主题反色
|
||||
const section = container.querySelector('section');
|
||||
expect(section?.className).toContain('bg-bg-primary');
|
||||
expect(section?.className).not.toContain('bg-white');
|
||||
});
|
||||
});
|
||||
|
||||
describe('ProductValueSection', () => {
|
||||
|
||||
Reference in New Issue
Block a user