Page MenuHomePhabricator

MediaWiki.org infobox obscures text in mobile view
Closed, InvalidPublic

Description

The page Wikimedia Discovery/Search has some information that would be helpful to visitors of page. It's displayed to the left of the project information box in the desktop site. The text reads something like,

See Help:Searching for a basic user guide, ...

While visiting the same page through a mobile browser the text is completely hidden if the width of the browser window is approximately below 370 pixels. Moreover it is displayed as a single vertical line of text for window widths approximately above 390 pixels.

Screen shot
Screen width : 370 pixels

Screen Shot 2017-05-28 at 12.27.32.png (525×375 px, 34 KB)

Screen width : 390 pixels

Screen Shot 2017-05-28 at 12.27.58.png (574×390 px, 38 KB)

This doesn't look nice. I guess it would be better to identify such text and display it below the box.

Event Timeline

Looks like a bug.

This particular example is not using an infobox. with infobox we remove the float property on smaller screens so that it doesn't have this layout issue. it's even creating gigantic whitespace below the div.

.plainlinks.vatop < this div needs to have a float:none !Important; property based on the screen width. it should not float at all. it should be a block element. it fixes the issue.

Jdlrobson subscribed.

This is an on-wiki template issue
https://www.mediawiki.org/w/index.php?title=Template%3AWikimedia_engineering_project_information%2Fcore&type=revision&diff=2509408&oldid=2509372 should fix it but I'm not sure how translating templates works and I'm not seeing it propagate to the right place.

Regardless this is out of scope for the reading web team.

Jdlrobson renamed this task from Some useful text is hidden in mobile view to MediaWiki.org: Some useful text is hidden in mobile view.Jul 18 2017, 10:24 PM
Jdlrobson added a project: Language-Team.
Jdlrobson added a subscriber: Nikerabbit.
Nemo_bis renamed this task from MediaWiki.org: Some useful text is hidden in mobile view to MediaWiki.org infobox obscures text in mobile view.Jul 19 2017, 10:57 AM
Nemo_bis closed this task as Resolved.
Nemo_bis assigned this task to Jdlrobson.

Thanks @Nikerabbit had no idea you could translate templates! Thanks for sharing the knowledge :)
... but it looks like https://m.mediawiki.org/wiki/Wikimedia_Discovery/Search is not running the latest version yet.. Guessing it has not been approved? But why does an English version need to be approved if English is the language it is written in?

@Jdlrobson why does it need a table ? Also why is this not using infobox class ?

@TheDJ the rule is overly specific (table.infobox) to override default table css rules.
Now we have TemplateStyles on this wiki it would be better to fix it in the template itself though.

Thanks @Nikerabbit had no idea you could translate templates! Thanks for sharing the knowledge :)
... but it looks like https://m.mediawiki.org/wiki/Wikimedia_Discovery/Search is not running the latest version yet.. Guessing it has not been approved? But why does an English version need to be approved if English is the language it is written in?

The short answer is: because of the <translate> tags, the included templates must use the /en subpage, and all subpages are treated equally.

I don't seem to have translate rights or edit rights to the /en subpage. Shouldn't the change in the template be reflected in the /en subpage immediately? That's what's confusing me..

It isn't, because it is treated like any other translation subpage.

I don't have time to work this out and things seem to be working as expected so I suggest it's better addressed on the wiki: https://www.mediawiki.org/wiki/Template_talk:Wikimedia_engineering_project_information#Template_broken_on_mobile