Page MenuHomePhabricator

Changes to how templates are styled in mobile
Open, Needs TriagePublic

Description

Interface editors should review rendering on mobile devices for coordinates, Template:Reflist Template:multicol and collapsible elements. Some information on how to address these issues can be found here.

Background

Minerva, the skin used on mobile, has had some CSS in place to make some templates display better at mobile resolutions. Skins shouldn't decide how templates display, as these are maintained by community members so we are changing how this works so community members can easily opt-out of these styles where necessary.

As part of preparation for this work, we have decided to drop several styles (T360387).

What has changed

collapsible

We removed the rule:

.collapsible td {
	width: auto !important;
}

multicol

We removed the rule:

@media all and ( max-width: 720px ) {
  table.multicol > tbody > tr > td,
  table.multicol > tr > td {
	display: block !important;
	width: auto !important;
  }
}

Adding this to Template:Col-begin or MediaWiki:Common.css should address any issues with this.

coordinates, topicon

These were previously hidden. From now on, we recommend using https://www.mediawiki.org/wiki/Help:Page_status_indicators

For coordinates see: https://www.mediawiki.org/wiki/Reading/Web/Desktop_Improvements/Frequently_asked_questions#How_to_fix_the_coordinates_displaying_incorrectly_near_the_languages_button%3F

Reflist

We removed the following rule in Template:Reflist:

body.skin-minerva .reflist {
  column-gap: 2em;
}

Event Timeline

Looks like this should have gotten a notice and I'm not sure why it didn't.

For Tech News, please confirm if this is an accurate summary (or tweak as needed):

Some CSS in the Minerva skin has been removed to enable easier community configuration. Interface editors should check the rendering on mobile devices for aspects related to the classes: .collapsible, .multicol, .reflist, .coordinates, and .topicon. Further details are available on replacement CSS if it is needed.

I can then add that tomorrow (Friday). (Or you can add it directly once it's good.)

P.s. Thanks @Izno for noticing! For context: The task hadn't been updated in several weeks, hence it wasn't showing up in the "Updated in the last 8 days" search that we use to triage the dozens of new/old entries each week, hence I/we missed it. Sorry about that.