refactor(theme): 营销页 bg-white token 化(暗黑模式 Phase 2 · marketing 批次)
问题:Tailwind 原生 bg-white 是硬编码值,深色主题下不翻转, 导致整页/整 section 恒为纯白,与转深色的页头页脚割裂。 (globals.css:--color-bg-primary-rgb 浅色 255 255 255 → 深色 10 14 20) 改动:10 文件 67 处 bg-white → 项目 token,按语义二分类 - bg-bg-primary (33 处):页面/大块骨架(min-h-screen 容器、<section>、<main>) - bg-bg-elevated (34 处):浮起层(带 border 的卡片、表单输入、图标盒、grid 单元格) --color-bg-elevated 浅色 #FFFFFF → 深色 #151B23,同样翻转。 浅色主题下 bg-white / bg-bg-primary / bg-bg-elevated 三者同值(纯白), 故本次改动在浅色主题下零像素差异,只修复深色主题。 新增审计工具: - scripts/audit/hardcoded-color-audit.mjs:硬编码颜色分级盘点 (含 alpha 误报修正:bg-white/NN 半透明叠加两主题均成立,判 INFO 非 P0) - scripts/audit/darkmode-bg-verify.mjs:直接验证背景随主题翻转 (浅色应纯白、深色应 rgb(10,14,20) 且无残留纯白块) 审计结果:marketing P0 67 → 0;全站 P0 97 → 30 (剩余 components 16 / other 8 / layout 3 / ui-kit 3 为第二批;admin 本就为 0) 门禁: - tsc 0 error - eslint 0 error(50 warnings 全为既有,改动文件未新增) - jest 129/130 套件通过,1548 通过 / 2 跳过 / **0 断言失败** 唯一失败 src/lib/admin-api.test.ts 为**沙箱环境限制非代码问题**: CODEBUDDY_BROKER_DENY 拦截 readFileSync,单独复验同样失败, 与本次改动零交集(改动仅限 src/app/(marketing)/ 下 10 个页面组件) - 暗黑模式背景验证 18/18 PASS(9 路由 × 浅深双版)
This commit is contained in:
@@ -28,7 +28,7 @@ export function MethodologyContent({ data }: MethodologyContentProps) {
|
||||
return (
|
||||
<main>
|
||||
{/* Hero:品牌化定位,轻量 CTA */}
|
||||
<section className="relative min-h-[60vh] flex items-center overflow-hidden bg-white">
|
||||
<section className="relative min-h-[60vh] flex items-center overflow-hidden bg-bg-primary">
|
||||
<div className="max-w-container mx-auto px-4 sm:px-6 lg:px-10 relative z-10 w-full py-24 sm:py-28 lg:py-32">
|
||||
<div className="max-w-4xl">
|
||||
<motion.div
|
||||
@@ -84,7 +84,7 @@ export function MethodologyContent({ data }: MethodologyContentProps) {
|
||||
{phases.map((phase, idx) => (
|
||||
<motion.div
|
||||
key={phase.title || idx}
|
||||
className="relative overflow-hidden bg-white border border-border-primary transition-all duration-300 hover:-translate-y-1 hover:shadow-lg"
|
||||
className="relative overflow-hidden bg-bg-elevated border border-border-primary transition-all duration-300 hover:-translate-y-1 hover:shadow-lg"
|
||||
>
|
||||
<div className="p-7 md:p-8">
|
||||
<div className="w-11 h-11 rounded-full flex items-center justify-center mb-5 text-base font-bold bg-brand/10 text-brand">
|
||||
@@ -131,7 +131,7 @@ export function MethodologyContent({ data }: MethodologyContentProps) {
|
||||
</StaggerReveal>
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-white border border-border-primary p-10 sm:p-16 text-center">
|
||||
<div className="bg-bg-elevated border border-border-primary p-10 sm:p-16 text-center">
|
||||
<h3 className="text-xl font-bold text-ink mb-3">方法论内容即将发布</h3>
|
||||
<p className="text-text-secondary max-w-xl mx-auto leading-relaxed">
|
||||
我们正在沉淀与首批客户共创过程中的方法论实践,完成后将在此呈现完整框架。
|
||||
@@ -142,7 +142,7 @@ export function MethodologyContent({ data }: MethodologyContentProps) {
|
||||
</section>
|
||||
|
||||
{/* CTA:轻量导向服务与联系 */}
|
||||
<section className="relative py-20 sm:py-28 lg:py-32 overflow-hidden bg-white">
|
||||
<section className="relative py-20 sm:py-28 lg:py-32 overflow-hidden bg-bg-primary">
|
||||
<div className="absolute top-0 left-0 right-0 h-px bg-border-primary" />
|
||||
<div className="max-w-container mx-auto px-6 lg:px-10">
|
||||
<ScrollReveal className="text-center max-w-3xl mx-auto">
|
||||
|
||||
Reference in New Issue
Block a user