Page MenuHomePhabricator

Content issues with dark mode / non-white reading themes when rendered on mobilesapps / page content service
Closed, ResolvedPublic

Description

Umbrella ticket for all tasks related to theme problems.

Related Objects

StatusSubtypeAssignedTask
ResolvedDbrant
ResolvedBUG REPORT bearND
DeclinedBUG REPORTNone
ResolvedDbrant
DeclinedNone
DeclinedNone
ResolvedBUG REPORTJgiannelos
Invalid MattCleinman
DeclinedNone
ResolvedBUG REPORTDbrant
ResolvedMSantos
Resolvedvadim-kovalenko
ResolvedBUG REPORT MattCleinman
DeclinedNone
ResolvedBUG REPORTMSantos
ResolvedJoeWalsh
DeclinedNone
ResolvedLGoto
ResolvedMSantos
DeclinedNone
ResolvedJgiannelos
Resolvedvadim-kovalenko
Resolved JMinor
Resolvedvadim-kovalenko
ResolvedMSantos
ResolvedBUG REPORTABorbaWMF
DuplicateNone
ResolvedDbrant
DuplicateBUG REPORTNone
ResolvedBUG REPORTJeddyNW
ResolvedBUG REPORTNone
ResolvedBUG REPORTNone
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
OpenBUG REPORTNone
ResolvedDbrant
ResolvedDbrant
ResolvedDbrant
DuplicateNone
DuplicateNone
ResolvedDbrant
ResolvedBUG REPORTDbrant
ResolvedDbrant
OpenNone
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
InvalidBUG REPORTNone
DuplicateNone
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant
ResolvedBUG REPORTDbrant

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

Hi,
I‘ve noticed a bug when opening or rather viewing lists on the Wikipedia app whilst dark mode is turned on.
The table which is being displayed after opening the list doesn‘t change its background color from white to (probably) black, which prevents it from displaying the info (I think it‘s just the font that turned white too, which causes it to be illegible in the end). See enclosed screenshots (one with dark mode enabled and the other one with dark mode disabled).

I hope this information can be of help. If you have any further questions please don’t hesitate to message me.

Version: WikipediaApp/7.4.6.2972 (iOS 17.2.1; Phone)

image0 (35).png (1×828 px, 136 KB)

image2 (2).png (1×828 px, 149 KB)

+1:
I noticed the difficulty of displaying symbols in text layed on a dark or black background:

This might be the case on iPadOS, iOS, macOS, one example:

The article: “Greek numerals”/History/ >the text after’acrophonic’ :

image (22).png (1×1 px, 237 KB)

Hide/show button in the desktop collapsible block is not adapted for the dark mode:

.mw-collapsible-toggle-default .mw-collapsible-text {
    color: #0645ad;
}

Hide/show button in the desktop collapsible block is not adapted for the dark mode:

.mw-collapsible-toggle-default .mw-collapsible-text {
    color: #0645ad;
}

Just noticed this as well, it needs to follow the usual Codex-tokens.

+1, "the grey color" as the photo caption:

unnamed (21).png (2×1 px, 1 MB)

on the web version

here's some text that should change but doesn't, on https://en.wikipedia.org/wiki/List_of_Re:Zero_episodes

image.png (328×588 px, 40 KB)
image.png (333×588 px, 33 KB)

and another location that shouldn't change but does, two tables in https://en.wikipedia.org/wiki/Transport_Layer_Security

image.png (248×471 px, 32 KB)
image.png (257×470 px, 39 KB)

image.png (256×469 px, 32 KB)
image.png (261×465 px, 39 KB)

A small magnify icon inside the framed thumb image should be adapted for the dark mode:

.mw-content-ltr figure[typeof~='mw:File/Thumb'] > .mw-file-description::after,
.mw-content-ltr figure[typeof~='mw:File/Thumb'] > .mw-file-magnify::after {
    right: 6px;
    left: auto;
    background-image: url(/w/resources/src/mediawiki.skinning/images/magnify-clip-ltr.svg?8330e);
}

Снимок экрана 2024-08-03 в 02.02.43.png (192×482 px, 55 KB)

Separate task created: T372793

Suggested image tooltip in search results (example):

Screenshot 2024-08-05 at 10.58.20.png (592×646 px, 76 KB)

Separate task created: T372794

+1 through the iOS support email:

image (40).png (2×1 px, 209 KB)

image (39).png (1×1 px, 163 KB)

+ 1 through the support email:
I've notices dark modes render some blue tones difficult to read under daylight. Attached are examples in sepia and black themes. The blue characters are difficult to read on the latter.

Screenshot_20250125_200405_Wikipedia.jpg (1×1 px, 136 KB)

Screenshot_20250125_200332_Wikipedia.jpg (1×1 px, 160 KB)

+1 through the support email:
Hello. I would like to request a fix for the darkness of text under images in dark mode. Attached is example of what I see when using mobile app. I cannot find any setting to remedy this. I search Wiki quite often and have been using the app probably as long as it's been out and this has always been an issue.

Screenshot_20250306-163827.png (2×1 px, 2 MB)

Seddon renamed this task from Issues with dark mode / non-white reading themes to Issues with dark mode / non-white reading themes on mobilesapps / page content service.May 15 2025, 12:17 PM
Seddon renamed this task from Issues with dark mode / non-white reading themes on mobilesapps / page content service to Content issues with dark mode / non-white reading themes when rendered on mobilesapps / page content service.May 15 2025, 12:27 PM

Change #1082532 had a related patch set uploaded (by Dbrant; author: Dbrant):

[mediawiki/services/mobileapps@master] Use ResourceLoader instead of local copies of styles.

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

Change #1082532 merged by Cooltey:

[mediawiki/services/mobileapps@master] Use ResourceLoader instead of local copies of styles.

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

Closing this umbrella task, since the underlying issues have been resolved (our Content Service's dark mode is now at parity with mobile web) (T369435).
Therefore, any further dark mode issues in specific articles can be addressed by editing the article itself, per our general guidance for dark mode compatibility.

Of course, if there happens to be a new dark mode issue in apps, and not in mobile web, please report it as a new task.

Dbrant claimed this task.