| Esanders | |
| Dec 10 2025, 10:37 AM |
| F70979974: image.png | |
| Dec 10 2025, 10:37 AM |
| F70979939: image.png | |
| Dec 10 2025, 10:37 AM |
DataTable, as used by the table pager currently uses a custom light blue background #eaeeff in the header:
https://en.wikipedia.org/wiki/Special:ListFiles
In dark mode there is an inline hack to set background to transparent. Custom dark mode fixes should be avoided.
If we use @background-color-neutral, as is used in other tables, the no custom fix is required:
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| DataTable: Use design token for header background colour | mediawiki/core | master | +2 -15 |
Change #1216772 had a related patch set uploaded (by Esanders; author: Esanders):
[mediawiki/core@master] DataTable: Use design token for header background colour
Thanks for the ticket Ed.
@jsn.sherman @Samwalton9-WMF I asked Ed to tag moderator tools as the TablePager is used in ApiQueryAllMessages, protected pages, blocklist and visible to moderators so this might be in your wheel house.
@egardner also cc'ing you since you did some work on the related CodexTablePager
One could start trying to unify the appearance with CodexTablePager (which has transparent backgrounds for headers), but I think that might be out of scope for now. I'm just trying to migrate some last remaining custom colours to dark-mode compliant tokens, and this seems like a pretty small an uncontroversial change.
@Esanders Thanks for wanting to fix this. From a Codex perspective, here are my thoughts.
When something like this is problematic in this way, and could be updated to use a Codex component altogether, that would be the first suggestion and goal. Since this is a special page, I imagine this table could be updated to use the Codex table. However, I imagine this is very out of scope for what you are trying to fix. So the next ideal down the line would be to not only use a Codex token here which would help fix the dark mode hack issue, but also use a Codex color token in a way that most closely visually matches the Codex component equivalent, i.e. Table. The Codex Table has a transparent header background.
So my suggestion would be to update the background color of this header to use background-color-transparent.
Change #1216772 merged by jenkins-bot:
[mediawiki/core@master] DataTable: Use design token for header background colour