feat(P5): 暗色模式真正实现(令牌31/对比度全过/10页实测/DARK32/预算292KB/回归1003)
Deploy to GitHub Pages / deploy (push) Failing after 2m30s
Regression / regression (push) Failing after 2m2s

This commit is contained in:
aurora-admin
2026-09-14 02:38:35 +08:00
parent e77efcdc60
commit e13049f5b9
8 changed files with 291 additions and 47 deletions
+2 -31
View File
@@ -1093,39 +1093,10 @@ a.chip:hover { color: var(--au-color-brand); }
.other-files ul { margin: 8px 0 0; }
.other-files a { font-size: 13px; }
/* ---- 深色模式(html.aa-dark 覆盖站点级令牌;.design_library 令牌文件不动,演示 iframe 保持浅色) ---- */
html.aa-dark {
--au-color-page-bg: #14161C;
--au-color-card-bg: #1D2027;
--au-color-table-header-bg: #23262F;
--au-color-disabled-bg: #262A33;
--au-color-tag-green-bg: #16261A;
--au-color-text-title: #E8EAED;
--au-color-text-body: #C9CDD4;
--au-color-text-secondary: #8B95A7;
--au-color-text-placeholder: #5C6470;
--au-color-border: #2E323C;
--au-color-mask: rgba(0, 0, 0, 0.6);
--au-color-mask-strong: rgba(0, 0, 0, 0.75);
/* 品牌色族:暗色下整体提亮一档,保证链接/选中态在深底上的对比度 */
--au-color-brand: #5B7CFA;
--au-color-brand-hover: #7B97FF;
--au-color-brand-active: #4364D9;
--au-color-brand-bg: rgba(91, 124, 250, 0.18);
--au-color-focus-ring: rgba(91, 124, 250, 0.5);
/* 语义色:暗色下提亮,深底可辨 */
--au-color-success: #6CD03C;
--au-color-warning: #FFC53D;
--au-color-error: #FF5C5C;
--au-color-info: #40A9FF;
/* 阴影在深色下加重才能形成层次 */
--au-shadow-low: 0 1px 4px rgba(0, 0, 0, 0.5);
--au-shadow-medium: 0 4px 12px rgba(0, 0, 0, 0.55);
--au-shadow-high: 0 8px 24px rgba(0, 0, 0, 0.65);
}
/* ---- 深色模式(S2-P5 选型 A:令牌值收归 .design_library 令牌文件的 html.aa-dark 组,
本处只留站点结构样式;演示 iframe 由 app.js 注入 aa-dark 类随令牌同步反色) ---- */
html.aa-dark body { background: var(--au-color-page-bg); }
html.aa-dark .topbar { background: rgba(20, 22, 28, 0.92); }
html.aa-dark .demo-stage iframe { background: #F5F7FA; } /* 演示页保持浅色基调,避免 5 端样例反色失真 */
html.aa-dark .demo-code { background: #101216; }
html.aa-dark .a11y-key kbd { background: #262A33; border-color: #3A404C; border-bottom-color: #4A5160; }