Page MenuHomePhabricator

On the Swedish Wikipedia main page with the Timeless skin, background icons are repeated in "På andra projekt" in the sidebar
Closed, ResolvedPublic

Description

On the Swedish Wikipedia main page with the Timeless skin, background icons are repeated in "På andra projekt" in the sidebar.

Not sure if it's a bug in Timeless or a local customization in the Swedish Wikipedia.

Screenshot-2018-3-25 Wikipedia, den fria encyklopedin.png (659×420 px, 74 KB)

Event Timeline

It is a local gadget https://sv.wikipedia.org/wiki/MediaWiki:Gadget-InterProjectLinks.js
If you disable it in your gadgets (it's called there "Lägg till länkar till andra projekt i vänstermenyn") there are no those icons.

As far as I can see, there is a CSS rule that looks like this:

li.interProject,
.portlet .wb-otherproject-link,
#mw-panel div.portal div.body ul li.interProject,
#mw-panel div.portal div.body ul li.wb-otherproject-link {
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 18px;
	margin-left: 0;
}

This is not applied in Timeless.

Added

#p-wikibase-otherprojects .mw-portlet-body ul .wb-otherproject-link {
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 18px;
}

to https://sv.wikipedia.org/wiki/MediaWiki:Gadget-InterProjectLinks.css in https://sv.wikipedia.org/w/index.php?diff=42642259

The issue at svwiki is solved, but I'd still consider the fault to be on either:

  1. The Timeless skin that for reasons I can't explain does not reuse the same ids, classes or HTML structure (why can't #mw-site-navigation be called #mw-panel?) and/or
  2. The overly specific CSS selectors (why can't #mw-panel div.portal div.body ul li.wb-otherproject-link be changed to simply .wb-otherproject-link?)

Ok, I've investigated this further now. The hyperspecific CSS rules I complained about above are from https://sv.wikipedia.org/wiki/MediaWiki:Gadget-InterProjectLinks.css (I didn't realize this at the time I wrote that). However, they are there because Vector has these ridiculously specific rules:

#mw-panel .portal .body li {
	line-height: 1.125em;
	margin: 0;
	padding: 0.25em 0;
	font-size: 0.75em;
	word-wrap: break-word;
}

This is the core problem as I see it (unless the rabbit hole goes even deeper). @matmarex, @Volker_E: Is there any chance Vector's specificity here could be lowered? Otherwise we're just playing this ridiculous game about who can shout the loudest.

Is there any chance Vector's specificity here could be lowered? Otherwise we're just playing this ridiculous game about who can shout the loudest.

Maybe? You can work on it if you want :) But to me it seems like a very small improvement, and a non-zero chance to break some gadget on some wiki and make everyone angry.

matmarex edited projects, added WMF-General-or-Unknown; removed Timeless.

The issue at svwiki is solved…

Let's close then.

The Timeless skin that for reasons I can't explain does not reuse the same ids, classes or HTML structure (why can't #mw-site-navigation be called #mw-panel?)

Skins don't really have to use the same structure. I think Timeless also duplicates some of the menus in the HTML (for different responsive rendering), making this more difficult.