fix(dark mode): make text-muted theme-aware via the secondary token#7985
fix(dark mode): make text-muted theme-aware via the secondary token#7985talissoncosta wants to merge 1 commit into
Conversation
Point $text-muted at --color-text-secondary so the .text-muted utility resolves to #656d7b in light (unchanged) and #9da4ae in dark: 7.16:1 vs the old static 3.45:1, fixing WCAG AA. One line, no usage churn, since .text-muted does not collide with the token utilities. Contributes to #6606 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Docker builds report
|
|
Note Currently processing new changes in this PR. This may take a few minutes, please wait... ⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
Comment |
Playwright Test Results (oss - depot-ubuntu-latest-16)Details
Playwright Test Results (oss - depot-ubuntu-latest-arm-16)Details
Playwright Test Results (private-cloud - depot-ubuntu-latest-16)Details
Playwright Test Results (private-cloud - depot-ubuntu-latest-arm-16)Details
|
|
Caution Failed to replace (edit) comment. This is likely due to insufficient permissions or the comment being deleted. Error details |
Visual Regression19 screenshots compared. See report for details. |
|
Consolidated into #7982 so the whole dark-mode colour change can be QA'd in one pass. Same commit is included there. |
Changes
Contributes to #6606.
.text-mutedis a static#656d7bwith no dark variant, so muted text is 3.45:1 on the dark surface (fails WCAG AA). Point$text-mutedat the--color-text-secondarytoken so the utility becomes theme-aware:#656d7bin light (unchanged, 5.22:1) and#9da4aein dark (7.16:1).One line, no usage churn. Unlike
text-secondary,.text-muteddoesn't collide with the token utilities, so its ~170 usages don't need migrating; fixing the value is enough. Full removal of Bootstrap's.text-mutedcan come with the later cleanup.How did you test this code?
Compiled the stylesheet:
.text-mutednow emitscolor: var(--color-text-secondary) !important. Light mode unchanged; recommend a dark-mode eyeball on muted text (tables, forms, labels).