Page MenuHomePhabricator

Border colours are too bright in dark mode
Open, Needs TriagePublic

Description

Borders for infoboxes and other templates seem to have inherited the border-color-base value from light mode (#a2a9b1) which makes them look super bright and detract from the polished feeling of the dark mode as a whole. We should convert these borders to use the border-color-subtle variable, which is #54595D in dark mode and improves the appearance of almost every page.

Here's a side-by-side comparison

border-colour-subtle above and base below

Screenshot 2024-06-05 at 10.43.49 AM.png (1×1 px, 908 KB)

base above and subtle below in light mode

Screenshot 2024-06-05 at 10.56.53 AM.png (442×1 px, 498 KB)

Update:

We can also leave the existing colours on the borders for these templates and use the 'border-color-base` variable in both light and dark mode to make an improvement.

Event Timeline

Jdlrobson subscribed.

@JScherer-WMF these styles are currently maintained on wiki, so you'll need to bring this up on the Discord channel. We don't have control over them in Vector 2022.
https://en.wikipedia.org/wiki/MediaWiki:Common.css#L-283

@JScherer-WMF these styles are currently maintained on wiki, so you'll need to bring this up on the Discord channel. We don't have control over them in Vector 2022.
https://en.wikipedia.org/wiki/MediaWiki:Common.css#L-283

Thanks, Jon. Done.

@stjn noted:

Since other places like .wikitable and .catlinks use border-color-base, it would be more beneficial for uniformity to have infoboxes also use the same
And that variable actually gets changed in night mode from #a2a9b1 to #72777d
the problem here is more so that enWP does not have night mode vars in place, compare to
https://ru.wikipedia.org/wiki/Фонд_благосостояния_Турции?useskin=vector-2022&vectornightmode=1
that is from https://ru.wikipedia.org/wiki/MediaWiki:Common.css#L-526

Yeah, I agree on the consistency point. Even though subtle is a better colour for this usecase overall in my opinion, the dark mode base at #72777d would be preferable to the light mode base at #a2a9b1. That would still make a big improvement.

Updating ticket accordingly.