Page MenuHomePhabricator

navigational sidebar on mobile, should float on wide screens.
Open, Needs TriagePublic

Description

When viewing a Wikipedia article with Examples sidebar (such as this one ) on a mobile device, the sidebar is shown in the centre of the page, and above other content, whereas with the the desktop view, it is in the right (this is the expected behaviour).

Related Objects

StatusAssignedTask
OpenNone
ResolvedTgr
ResolvedAnomie
Resolvedtstarling
Resolvedcoren
ResolvedAnomie
StalledMhurd
ResolvedAnomie
ResolvedEsanders
ResolvedEsanders
Resolvedssastry
ResolvedAnomie
ResolvedCKoerner_WMF
Resolvedjhsoby
ResolvedTgr
DeclinedTgr
Resolvedcoren
ResolvedAnomie
ResolvedTgr
OpenNone
Resolvedssastry
ResolvedTgr
ResolvedTgr
ResolvedTgr
ResolvedDeskana
ResolvedCKoerner_WMF
ResolvedWhatamidoing-WMF
ResolvedTgr
ResolvedTgr
ResolvedTgr
ResolvedUrbanecm
ResolvedTgr
ResolvedTacsipacsi
ResolvedTgr
ResolvedCKoerner_WMF

Event Timeline

Restricted Application added subscribers: StudiesWorld, Aklapper. · View Herald TranscriptFeb 22 2016, 5:36 PM

mobile web or one of the apps? if apps, which platform?

This appears on the mobile website, I was viewing it through Safari on my iPad, and it is the same on the iPad Chrome browser.

Aklapper edited projects, added MobileFrontend; removed Mobile.Mar 9 2016, 12:32 PM

This is an issue with the local template and not an issue with MobileFrontend.

He7d3r added a subscriber: He7d3r.Mar 12 2016, 2:40 PM

Actually, that template uses
https://en.m.wikipedia.org/wiki/Template:MetaSidebar
which contains style="float:right;...". However, in the mobile version, some CSS overwrites this with float: none !important;.

The same happens with the Template:MetaSidebar on mobile devices

You can't just float stuff on a small screen. Seems like intended behaviour to me, I agree with @Jdlrobson.

@Sjoerddebruin, not all mobile screens are small. For example, my iPad has a fairly large screen, and it looks weird when the examples are at the top of the page, before any other content, as opposed to at the side of it. Also, other boxes, such as infoboxes, are shown on the right of the screen, similarly to on a desktop.

TheDJ renamed this task from Wikipedia examples sidebar on mobile to navigational sidebar on mobile, should float on wide screens..Mar 13 2017, 3:08 PM
TheDJ added a subscriber: TheDJ.Mar 13 2017, 3:12 PM

This seems an artefact from the times where minerva was exclusively for narrow screens. Infobox float on tablet, so an element like this should be possible to be fixed as well.

TheDJ added a comment.Mar 13 2017, 3:17 PM

BTW. I've added vertical-navbox class to this template now, which hides it fully, like any other navbox.. That too is something that should be considered to be limited devices below the tablet width btw...

@TheDJ wow this is old - had completely forgotten about it. Anyway, the examples box on
this page does not display at all on my iPad anymore.

Jdlrobson moved this task from Needs triage to Triaged on the Mobile board.Jul 25 2017, 5:47 PM