Page MenuHomePhabricator

image embeds failing with Timeless skin
Closed, ResolvedPublic

Assigned To
Authored By
Gwennie-nyan
Dec 11 2020, 10:06 PM
Referenced Files
F33943357: firefox_24Fx7pHyn7.png
Dec 12 2020, 2:52 AM
F33943358: firefox_RRiVG9r7Ck.png
Dec 12 2020, 2:52 AM
F33943359: firefox_87WXrtOSS1.png
Dec 12 2020, 2:52 AM
F33943356: firefox_x3N2pUFk5m.png
Dec 12 2020, 2:52 AM
F33943361: firefox_bhCZLTBs3P.png
Dec 12 2020, 2:52 AM
F33943360: firefox_IDNMYgJVsD.png
Dec 12 2020, 2:52 AM

Description

I first noticed it when my {{tmbox}} on my en-wiki userpage stopped embedding. I then found that it didn't embed in the doc page for the template either. I tried the rest of the skins and in a clean save/private window. The only issue seems to be the Timeless theme skin.

Event Timeline

Specifically can be seen here: https://en.wikipedia.org/wiki/User:Gwenhope?useskin=timeless

Appears to be a problem with the css to stop images from overflowing the content, as setting a max-width to a percentage value inside a table cell results in a width of 0 because tables are stupid.

While I'd love to give you (or really, whoever made the template) crap for using tables for non-table formatting, this is also going to be an issue on any actual info tables that happen to involve images anywhere, and thus this has helpfully highlighted the issue for us.

Probably just need to make exceptions for tables and infoboxes and crap and be done with it...

Appears to be a problem with the css to stop images from overflowing the content, as setting a max-width to a percentage value inside a table cell results in a width of 0 because tables are stupid.

While I'd love to give you (or really, whoever made the template) crap for using tables for non-table formatting, this is also going to be an issue on any actual info tables that happen to involve images anywhere, and thus this has helpfully highlighted the issue for us.

Sorry this template has existed for at least a decade before I began actively editing the wiki. Last update to the template was made in 2013 when they switched to local Lua invocation instead of on-wiki template via template code. Regardless I appreciate your quick looking into this issue.

I've also just discovered it applies to {{mbox}} as well, since they both are invocations of the same Lua backend. The difference with mbox is the text vanishes, not the images.

The difference with mbox is the text vanishes, not the images.

O___o

I have... so many questions...

But seriously, keep the weirdness coming, man. This is really helpful!

But seriously, keep the weirdness coming, man. This is really helpful!

I'll post anything I find that is bugged in this Timeless-based vein.

Here's some screenshots from various template boxes in this class which implement {{mbox}} (or, more-specifically, the {{Message box|mbox}} Lua module)

firefox_bhCZLTBs3P.png (390×1 px, 45 KB)

firefox_IDNMYgJVsD.png (833×1 px, 86 KB)

firefox_87WXrtOSS1.png (374×1 px, 18 KB)

firefox_RRiVG9r7Ck.png (321×1 px, 35 KB)

firefox_24Fx7pHyn7.png (491×1 px, 53 KB)

firefox_x3N2pUFk5m.png (251×1 px, 22 KB)

Okay, so trying to duplicate this locally, it looks like it's not that images break in tables with timeless' new styles, but rather that these new styles combined with the wikipedia tmbox (etc) styles break. So I'm really hoping that is still just in tables...

(The message box module and templates are due for an upgrade from 10 years ago when they were designed, it's just a rather complex design.)

Change 649111 had a related patch set uploaded (by Isarra; owner: Isarra):
[mediawiki/skins/Timeless@master] Limit image overflow limits to not tables

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

Gwennie-nyan triaged this task as Medium priority.

Patch fixes image overflow issues confirmed via compiling less -> css and trying it out as user css for Timeless. Message box templates rendering correctly. Recommend patch for publication.

Change 649111 merged by jenkins-bot:
[mediawiki/skins/Timeless@master] Limit image overflow limits to not tables

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

Good job Isarra, thanks for the quick fix!