MediaWiki:Mobile.css

/** You are editing the global css file for all mobile site users. With Great Power Comes Great Responsibility.

Some words of caution:
 * Avoid any changes which impact layout on a mobile device.
 * Please be careful not to introduce any margin / padding rules. These should be done inside the template itself via an inline style.
 * Be especially cautious when a template is likely to be used within the top 480px of the screen (the content that the user will see first on a mobile device).
 * Do not use display:none. Instead edit the template and markup the element you want to hide with the `nomobile` class.
 * Try to keep rules as generic and minimal as possible. Do not have 2 selectors doing the same thing. Introduce a common class and use that instead.
 * For big changes consult the grafana dashboard to ensure you don't introduce any performance regressions.
 * Group common css rules together where possible.

Do not put specific styles for the following into this file:

Template:Navbar (.navbar)
See Template:Navbar/styles.css (Template_talk:Navbar)

Template:Hlist (.hlist)
See Template:Hlist/styles.css



/* Mobile template hacks (see phab T56176) If you are looking for the following, please update your template to use TemplateStyles: .mobile-float-reset { float: none !important; width: 100% !important; }



/* Hide the images */ .geo-nondefault, .geo-multi-punct, /* Hide stuff meant for accounts with special permissions. Made visible again in  MediaWiki:Group-sysop.css, MediaWiki:Group-patroller.css and MediaWiki:Group-autoconfirmed.css. */ .checkuser-show, .sysop-show, .templateeditor-show, .extendedmover-show, .patroller-show, .extendedconfirmed-show, .autoconfirmed-show, /* Copied from Common.css - allow for hiding text in compact form e.g. clean up templates */ .hide-when-compact, /* portal pages are badly formatted. Until this changes these should be hidden. (see https://phabricator.wikimedia.org/T86495) */ .noprint.portal { display: none; }

/* For linked citation numbers and document IDs, where the number need not be shown on a screen or a handheld, but should be included in the printed version TODO: Move to Citation template when templates have stylesheets See https://www.mediawiki.org/wiki/Requests_for_comment/Allow_styling_in_templates @media screen, handheld { .citation *.printonly { display: none; } } /* Should be moved into Template:Cite_web Styling for citations (CSS3). Breaks long urls, etc., rather than overflowing box */ .citation { word-wrap: break-word; } .infobox { border: 1px solid #a2a9b1; border-spacing: 3px; background-color: #f8f9fa; color: black; /* @noflip */ padding: 0.2em; /* @noflip */ float: right; /* @noflip */ clear: right; font-size: 88%; line-height: 1.5em; } .infobox caption { font-size: 125%; font-weight: bold; padding: 0.2em; text-align: center; } .infobox td, .infobox th { vertical-align: top; /* @noflip */ text-align: left; } .infobox.bordered { border-collapse: collapse; } .infobox.bordered td, .infobox.bordered th { border: 1px solid #a2a9b1; } .infobox.bordered .borderless td, .infobox.bordered .borderless th { border: 0; }

/* styles for bordered infobox with merged rows */ .infobox.bordered .mergedtoprow td, .infobox.bordered .mergedtoprow th { border: 0; border-top: 1px solid #a2a9b1; /* @noflip */ border-right: 1px solid #a2a9b1; }

.infobox.bordered .mergedrow td, .infobox.bordered .mergedrow th { border: 0; /* @noflip */ border-right: 1px solid #a2a9b1; }

/* Default styling for Navbar template TODO: Move to Navbar template ASAP .navbar { display: inline; font-size: 88%; font-weight: normal; } .navbar ul { display: inline; white-space: nowrap; } .navbar li { word-spacing: -0.125em; } .navbar.mini li span { font-variant: small-caps; } /* Navbar styling when nested in infobox and navbox */ .navbox .navbar, .infobox .navbar { font-size: 100%; } .navbox .navbar { display: block; } .navbox-title .navbar { /* @noflip */ float: left; /* @noflip */ text-align: left; /* @noflip */ margin-right: 0.5em; width: 6em; } /* Unbulleted lists e.g. Barack Obama page*/ .plainlist ul { list-style: none; padding-left: 0; /* Reset Minerva defaults */ }

.visualhide { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Geographical coordinates hidden in mobile. Any styles relating to them should be put inside .Template:Coord/link */

/* Prevent line breaks in silly places: 1) Where desired  2) Links when we don't want them to   3) Bold "links" to the page itself   4) Ref tags with group names  --> "[Note 1]" Please document here what pages use this Enabled .mw-parser-output .nowrap, .nowraplinks a, .nowraplinks .selflink, sup.reference a { white-space: nowrap; } .mw-parser-output .infobox .nowrap { white-space: normal !important; } /* But allow wrapping where desired: */ .wrap, .wraplinks a { white-space: normal; }

/* Generic class for Times-based serif, texhtml class for inline math */ .times-serif, span.texhtml { font-family: serif; } span.texhtml { white-space: nowrap; }

/* Enable custom list style types for lists of references */ .reflist ol.references { list-style-type: inherit; }

/* Hanging indentation for Template:Refbegin */ .refbegin-hanging-indents > ul, .refbegin-hanging-indents > dl { list-style-type: none; margin-left: 0; } .refbegin-hanging-indents > ul > li, .refbegin-hanging-indents > dl > dd { margin-left: 0; padding-left: 1.0em; text-indent: -1.0em; list-style: none; }

/* Prevent flags in tables from collapsing Fix for T116318 .flagicon img { min-width: 25px; }

/* Prevent unnecessary margin at the bottom of centralnotices */ .cnotice { margin-bottom: 0 !important; }

/* The message body cell(s), such as for. * this is a very small subset of the styles from Common.css * just to make sure the box isn't squashed without any spacing * which looks out of place with visuals of other nearby elements */ .mbox-text { /* @noflip */ padding: 0.25em 0.9em; }

/** These styles will be removed shortly. Please see inline comments.
 * DEPRECATED STYLES ************************************

/* Generate interpuncts FIXME: Move to template. /* Can be removed when T169315 is resolved */ font-size: 0.8em; color: #333; } /* FIXME: DUPLICATES Template:Hlist/styles.css Note the mobile skin provides a `hlist-separated` class for this purpose. Use this class name alongside the hlist class instead as this will result in a FOUC. Should be removed and moved to templates. /* Counter hlist indenting of Minerva*/ .mw-parser-output .hlist ul, .mw-parser-output .hlist ol { padding-left: 0; } /* reset hlist margins of Minerva do not add li here (see T235416) */ .mw-parser-output .hlist dd, .mw-parser-output .hlist dt { margin-right: 0; } /* do not add li here. Minerva provides it already*/ .mw-parser-output .hlist dd:after { content: " · "; font-weight: bold; } .mw-parser-output .hlist dt:after { content: ": "; } /* Should be removed and moved to templates once TemplateStyles is live */
 * 1) content .hlist-separated li:after {

.heading-holder hlist li:after, .mw-parser-output .hlist dd:last-child:after, .mw-parser-output .hlist dt:last-child:after, .mw-parser-output .hlist li:last-child:after { content: none; } /* Add parentheses around nested lists */ /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist dd dd:first-child:before, .mw-parser-output .hlist dd dt:first-child:before, .mw-parser-output .hlist dd li:first-child:before, .mw-parser-output .hlist dt dd:first-child:before, .mw-parser-output .hlist dt dt:first-child:before, .mw-parser-output .hlist dt li:first-child:before, .mw-parser-output .hlist li dd:first-child:before, .mw-parser-output .hlist li dt:first-child:before, .mw-parser-output .hlist li li:first-child:before { content: " (";	font-weight: normal; } /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist dd dd:last-child:after, .mw-parser-output .hlist dd dt:last-child:after, .mw-parser-output .hlist dd li:last-child:after, .mw-parser-output .hlist dt dd:last-child:after, .mw-parser-output .hlist dt dt:last-child:after, .mw-parser-output .hlist dt li:last-child:after, .mw-parser-output .hlist li dd:last-child:after, .mw-parser-output .hlist li dt:last-child:after, .mw-parser-output .hlist li li:last-child:after {	content: ") "; font-weight: normal; } /* Put ordinals in front of ordered list items */ /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist ol { counter-reset: listitem; } /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist ol > li { counter-increment: listitem; } /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist ol > li:before { content: " " counter(listitem) " "; white-space: nowrap; } /* Should be removed and moved to templates once TemplateStyles is live */ .mw-parser-output .hlist dd ol > li:first-child:before, .mw-parser-output .hlist dt ol > li:first-child:before, .mw-parser-output .hlist li ol > li:first-child:before { content: " (" counter(listitem) " "; }

/* https://phabricator.wikimedia.org/T180396#5317728 */

@media print { .navbox, .hatnote, .ambox { display: none; } }