NOTE: Template editors will be able to override this locally (For now using !important) and in future, we will provide a mechanism to disable these rules.
Problem: We have common templates spread across our wikis where colors have no semantic value in night mode. To limit the work that template editors have to do adopting night mode, we will ship styles that disable these colors.
Acceptance criteria
- The rule for now will apply only to Minerva and live inside skins.minerva.base.styles/common/hacks.less
- The rule will look like the following
html.skin-night-mode-clientpref-1 {
.mw-parser-output {
/* general case that templates/extensions can opt into*/ .skin-nightmode-reset-color,
/* T357735 */ .quotebox.
/* T357726 */.side-box, .side-box *,
/* T358012 */ .navbox-even, .navbox-abovebelow, .navbox-title, .navbox-group
{
:not(.notheme) { .night-mode-strip-all-colors-when-safe(); }
}
/* T358385 */ [bgcolor]
{
color: #333; /* Important: this should correspond with the light mode theme version of color-base */
}
}
}
@media ( prefers-color-scheme: dark ) {
// copy of above
}QA
This fixes various bugs. Please check these bugs and report back here.
QA Results - Beta
| Bug | Status | Details |
|---|---|---|
| T357726: Color contrast issue with Template:Side_box in Minerva Night Mode | ✅ | T357726#9612779 |
| T358012 Navbox Related Color Contrast Issue in Minerva Night Mode | ⬜ | should be tested in prod |
| T357735 Color contrast issues with Template:Quote_box in Minerva Night Mode | ❌ | T357735#9613573 |
| T358385: Address issues with usage of (bgcolor) | ❓ | This looks like it's already fixed in Prod. |
QA Results - Prod
Sign off steps
- Make sure that a decision has been made around stability of classes created/utilized in this sprint such as .notheme, .skin-nightmode-reset-color (see Slack conversation). If no decision has been made create a new spike to discuss.