Thank you for tagging this task with good first task for Wikimedia newcomers!

Newcomers often may not be aware of things that may seem obvious to seasoned contributors, so please take a moment to reflect on how this task might look to somebody who has never contributed to Wikimedia projects.

A good first task is a self-contained, non-controversial task with a clear approach. It should be well-described with pointers to help a completely new contributor, for example it should clearly pointed to the codebase URL and provide clear steps to help a contributor get setup for success. We've included some guidelines at https://phabricator.wikimedia.org/tag/good_first_task/ !

Thank you for helping us drive new contributions to our projects <3

I tried replicating this issue locally, but I am unable to. Below is the normal view of the babel in light mode

• Light Mode (Image 1)

Then I switched to normal Mediawiki (Vector 2022) dark mode as shown below

• Dark Mode (Image 2)

Then I set it to Automatic Dark Mode (which is the default) as shown below

• Automatic Dark Mode (Image 3)

Finally I switched back to normal light mode and my new view was exactly like Image 1.

Also I am still pretty lost on what Meta is but I am currently trying to replicate the issue in my Local Mediawiki setup with Babel and Darkmode and Vector2022 skins as ad on extensions and skins.

Any further help on replicating this issue would be very much appriciated.

Hi @Destiny thanks for looking at this one! Something looks wrong with your dark mode (the icons in the top right are not visible!). There shouldn't be any additional setup requirements for dark mode. You should only need Babel, Vector (edited) and MediaWiki setup to replicate this!

When you say you have dark mode setup, do you mean https://www.mediawiki.org/wiki/Extension:DarkMode ?
If so please uninstall that extension and instead add the following to your LocalSetttings.php instead:

$wgVectorNightMode['logged_out'] = true;
$wgVectorNightMode['logged_in'] = true;

Let me know if you have any other questions!

In T374794#10176548, @Jdlrobson wrote:

You should only need Babel, Minerva and MediaWiki setup to replicate this!

Please note that I used Vector 2022 in my report, not Minerva. Minerva may also work, but I haven’t tested it (and switching between modes is much slower, as the mode selector is on Special:MobileOptions, not right in the sidebar).

I’ve realized that I should’ve made screenshots; I added them now.

@Jdlrobson, Yes I did use Darkmode extension, I will remove it and follow you suggestion. Let me try that for now.

Change #1075956 had a related patch set uploaded (by Obamwonyi; author: Obamwonyi):

[mediawiki/skins/Vector@master] component: notheme isn’t respected for text color in automatic night mode

https://gerrit.wikimedia.org/r/1075956

Change #1075975 had a related patch set uploaded (by Obamwonyi; author: Obamwonyi):

[mediawiki/skins/Vector@master] component: notheme isn’t respected for text color in automatic night mode

https://gerrit.wikimedia.org/r/1075975

Change #1075956 abandoned by Jdlrobson:

[mediawiki/skins/Vector@master] component: notheme isn’t respected for text color in automatic night mode

Reason:

This has been resolved by https://gerrit.wikimedia.org/r/c/mediawiki/skins/Vector/+/1075975

https://gerrit.wikimedia.org/r/1075956

Change #1075975 merged by jenkins-bot:

[mediawiki/skins/Vector@master] component: notheme isn’t respected for text color in automatic night mode

https://gerrit.wikimedia.org/r/1075975

@Jdlrobson @bwang Can you review gif below please? Nothing in the Babel box changes when swapping to automatic, light and dark. It all stays the same. Is that what it's supposed to look like?

Test Result - Meta

Status: ❓NMI
Environment: Meta
OS: macOS Sonoma 15.0
Browser: Chrome 129
Device: MBA
Emulated Device: NA

Test Artifact(s):

Test Steps

Test Case 1: Ensure Readable Text Color in Babel Boxes in Night Mode

1. Enable the Accessibility for Reading beta feature on Meta.
2. Visit https://meta.wikimedia.org/wiki/User_language?useskin=vector-2022.
3. Switch to night mode.
4. AC1: Confirm that the Babel boxes display dark text on a light background.

I think the problem is you are using Chrome's dark setting rather than the operating system setting (see my gif)

I can confirm the fix is working as expected @GMikesell-WMF :

@GMikesell-WMF that looks right to me! we want that box to look the same in dark and automatic

In T374794#10196825, @GMikesell-WMF wrote:

Derived Requirement

Ensure that Babel boxes maintain readable text color when switching between night mode and automatic mode in the Vector 2022 skin, with appropriate text and background contrast.

Please note that I intentionally left out Babel from both the task title and the project tags – my requirement is that the notheme class works wherever it’s used. Of course, the test steps use Babel, because that’s an easily testable symptom, but I don’t think the requirement should mention Babel.

Anyway, thanks everyone for fixing and testing this!