The use of filter appears to establish a stacking context (https://drafts.fxtf.org/filter-effects/#placement)
So even though this only impacts dark mode, this seems like a general bug with the mobile diff page for any element in the footer that might some day use CSS filters. Thanks for flagging @Tufor!

Hi @Jdlrobson, I can take this up, if it's still relevant!

Yes please ! patch very much welcome!

Tried reproducing on my local system (Minerva theme and mobile screen with dark mode) and there seems to be no issue right now. I might be wrong about this, though, so is there a specific sequence of steps I need to try? @Tufor

@theprotonade I can reproduce this but only in dark mode!

Steps to reproduce:

• Visit https://pl.m.wikipedia.org/w/index.php?title=Divock_Origi&diff=prev&oldid=74395337&minervanightmode=1 incognito window in Chrome
• Resize browser to 500px
• Scroll down page to bottom of page
• Scroll slightly up so that the Wikipedia footer logo overlaps the username

@theprotonade thank you for your willingness to investigate and to solve this problem. Problem still exists, I just recreated it again.

Diff: https://pl.m.wikipedia.org/w/index.php?title=Wikipedysta:Tufor/brudnopis&diff=prev&oldid=45236475

Mobile version (so Minerva skin), dark mode. That's all that is needed. I just used a private mode on my smartphone's mobile browser (Firefox mobile) so I'm logged out, changed the theme to the dark mode and opened a random diff, and the "Wikipedia" logo still is "over" this box, like in the screenshot above. You just have to scroll all the way to the bottom.

The problem 100% stems from the inversion of colors of images by css. I found that other things (images) also can float over the content of this box:

The problem 100% stems from the inversion of colors of images by css. I found that other things (images) also can float over the content of this box:

Yep. Please see T370943#10038953 for more context on what's happening here if you missed it!

Got it. For some reason, it shows on the prod site but not on my local, but I'll figure that out.
Thanks for the details! I'll take a look and put in a patch soon.

In case it's helpful here's my local logo setup:

$wgLogos = [
	'wordmark' => [
		'src' => "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia-wordmark-en.svg",
		'width' => 120,
		'height' => 18,
	],
	'tagline' =>  [
		'src' => "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia-tagline-en.svg",
		'width' => 117,
		'height' => 13,
	],
];

Oh yeah, I have something similar too, but that should help :)

Hey @theprotonade how are you getting on with this ticket?

Is this something that fits in with your current work @Samwalton9-WMF ?

Is it possible that T376228 is the same issue / solved by the patch awaiting review there?

The issue is identical but the fix needs to be applied in both places (diff and search).
As I mentioned earlier om T370943#10038953 "eThe use of filter appears to establish a stacking context (https://drafts.fxtf.org/filter-effects/#placement)" so any use of the CSS filter in both places needs to be updated with this in mind.

Change #1207128 had a related patch set uploaded (by Jon Harald Søby; author: Jon Harald Søby):

[mediawiki/skins/MinervaNeue@master] Footer logo: Add z-index to fix logo appearing above diff overlay

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

Change #1207138 had a related patch set uploaded (by Jon Harald Søby; author: Jon Harald Søby):

[mediawiki/skins/MinervaNeue@master] Revert "Fix CSS filter creating a new stacking context"

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

The proposed fix is to Minerva and touches more than the diff page so circling in the reader experience team.

For testing on beta cluster you can enable this logo via config change:

Change #1207128 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Footer logo: Add z-index to fix logo appearing above diff overlay

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

I created a task (with a patch) to configure the beta cluster to have the wordmark logo (e.g. for Minerva), to help QA this and other similar issues

https://phabricator.wikimedia.org/T413217

This looks like it's been fixed by the moderator tools team with their work in T402297 (or this patch merged by Bernard). Can be QAed in production and on https://en.wikipedia.beta.wmcloud.org/w/index.php?title=Polar_bear&diff=664870&oldid=664780&minervanightmode=1

Change #1207138 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Revert "Fix CSS filter creating a new stacking context"

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

Checked on wmf.10 - the issue is fixed:

Pretty sure it was my patch that was merged above that fixed it ;-)

Sorry about the mis-attribution! I blame the December holidays :-) Thank you for your help here! I am glad its fixed!