Sitelink badges (wb-badges-default.svg) are invisible in dark mode
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	Lokal_Profil
	Jul 28 2025, 8:01 PM

Description

In dark mode, you cannot see the icon for setting the badges for sitelinks.

This is because the badge is set as a background-image (SVG) in jquery.wikibase.sitelinkview.less and has a #000 fill colour.

Steps to reproduce:

Open an item in dark mode, e.g. https://www.wikidata.org/wiki/Q4115189?useskin=vector-2022&vectornightmode=1
Start editing the sitelinks
Notice that next to each sitelink title there’s an invisible, but clickable badge button (the cursor will change to a different cursor); clicking that will open the badge selector as usual

Acceptance criteria:

The badge icon is visible in both light and dark mode

Notes:
See e.g. this change for how we fixed this for other icons by turning them into masks.

Details

Related Changes in Gerrit:

	Subject	Repo	Branch	Lines +/-
	Fix empty badge for dark mode	mediawiki/extensions/Wikibase	master	+10 -2

Customize query in gerrit

Related Objects
Search...

		Status	Subtype	Assigned	Task
		Resolved		karapayneWMDE	T400646 Sitelink badges (wb-badges-default.svg) are invisible in dark mode
		Open		None	T402655 Delete/badge buttons visible on sitelink Creative Commons CC0 License acceptance banner

Event Timeline

Lokal_Profil created this task.Jul 28 2025, 8:01 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJul 28 2025, 8:01 PM

Hoping I picked the right Wikibase component, appologies if I didn't.

A quick fix to not make it completely invisible would be to make the image dark grey instead of completely black.

Maintenance_bot added a project: Wikidata.Jul 28 2025, 8:30 PM

Looks to me like this is probably in the Omega Team's area

Lucas_Werkmeister_WMDE added a project: dark-mode.Jul 29 2025, 8:33 AM

We fixed this for various other SVGs by turning them into masks (see e.g. this change), should be doable here I think.

@Lokal_Profil: can you share some links where the issue can be seen? Because there are at least 2, probably 3 (not sure) places where Wikibase defines badges (on the item view, either from Wikibase or from WikimediaBadges, and on client wikis), and it would be good to know which one is affected ^^

karapayneWMDE assigned this task to Lokal_Profil.Jul 29 2025, 9:24 AM

Ollie.Shotton_WMDE renamed this task from wb-badges-default.svg invisible in dark mode to Sitelink badges (wb-badges-default.svg) are invisible in dark mode.Jul 29 2025, 10:12 AM

Ollie.Shotton_WMDE updated the task description. (Show Details)

Okay, I can confirm it affects at least the UI to edit sitelink badges on the main item page (e.g. Q42), with the wikibase-sitelinkview-badges class name. If it affects other places as well, please say so or open another task :)

Lucas_Werkmeister_WMDE removed Lokal_Profil as the assignee of this task.Aug 7 2025, 2:25 PM

Lucas_Werkmeister_WMDE updated the task description. (Show Details)

Lucas_Werkmeister_WMDE moved this task from Incoming to The Backlog on the Wikidata-Omega board.

Lucas_Werkmeister_WMDE claimed this task.Aug 13 2025, 3:27 PM

Lucas_Werkmeister_WMDE edited projects, added Wikidata-Omega (The Board); removed Wikidata-Omega.

Lucas_Werkmeister_WMDE moved this task from new to the board to In Development on the Wikidata-Omega (The Board) board.

UX question (cc @Alice.moutinho): previously, the badge icon here was perfectly black (#000), but now we need a Codex token for it. There’s no pure black in the Codex colors – is it okay to change that icon to one of color-base or color-emphasized, or do we need some hack to make it perfectly black or white?

Change #1178573 had a related patch set uploaded (by Lucas Werkmeister (WMDE); author: Lucas Werkmeister (WMDE)):

[mediawiki/extensions/Wikibase@master] Fix empty badge for dark mode

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

gerritbot added a project: Patch-For-Review.Aug 13 2025, 3:55 PM

Also, should we update any of the other badges to also use color tokens? There’s the ones used on Wikidata (light and dark mode), and then also the one shipped by Wikidata as a default (I don’t think that one can be seen anywhere in Wikimedia production or on the Beta cluster, so I don’t know how to demo it). All of them use colors other than black, so I think they don’t look too horrible in dark mode, but perhaps we still want to change them.

Lucas_Werkmeister_WMDE removed Lucas_Werkmeister_WMDE as the assignee of this task.Aug 13 2025, 3:57 PM

Lucas_Werkmeister_WMDE moved this task from In Development to Ready for Peer Review on the Wikidata-Omega (The Board) board.

AudreyPenven_WMDE claimed this task.Aug 13 2025, 4:13 PM

AudreyPenven_WMDE moved this task from Ready for Peer Review to In Peer Review on the Wikidata-Omega (The Board) board.

AudreyPenven_WMDE removed AudreyPenven_WMDE as the assignee of this task.Aug 14 2025, 12:54 PM

AudreyPenven_WMDE moved this task from In Peer Review to Ready for Tech Verification on the Wikidata-Omega (The Board) board.

AudreyPenven_WMDE subscribed.

Change #1178573 merged by jenkins-bot:

[mediawiki/extensions/Wikibase@master] Fix empty badge for dark mode

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

Maintenance_bot removed a project: Patch-For-Review.Aug 14 2025, 1:30 PM

ReleaseTaggerBot added a project: MW-1.45-notes (1.45.0-wmf.15; 2025-08-19).Aug 14 2025, 2:00 PM