feat(P5): 暗色模式真正实现(令牌31/对比度全过/10页实测/DARK32/预算292KB/回归1003)
This commit is contained in:
+2
-31
@@ -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; }
|
||||
|
||||
|
||||
Reference in New Issue
Block a user