MediaWiki:Mobile.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
Lightyears (talk | contribs) (Added custom rules from common.css for quotations etc) |
||
Line 225: | Line 225: | ||
.divTableBody { | .divTableBody { | ||
display: table-row-group; | display: table-row-group; | ||
} | |||
/* Quote boxes */ | |||
.quotes { | |||
background: none repeat scroll 0 0 #F5FDFE; | |||
border: 1px solid #A8A8A8; | |||
margin-bottom: 10px; | |||
margin-left: 14px; | |||
padding: 6px; | |||
overflow: hidden; | |||
} | |||
/* Indented quotes without borders */ | |||
.indentedquotes { | |||
margin-left: 30px; | |||
margin-right: 30px; | |||
margin-bottom: 10px; | |||
} | |||
/* Small text Refs at bottom right within quote boxes */ | |||
.quotes_ref { | |||
font-size: 85%; | |||
text-align: right; | |||
} | |||
/* Box for Core articles */ | |||
.core_box { | |||
background: none repeat scroll 0 0 #F9F9F9; | |||
border: 1px solid #AAAAAA; | |||
clear: both; | |||
float: right; | |||
font-size: 85%; | |||
margin: 15px; | |||
padding: 0.3em; | |||
width: 260px; | |||
} | |||
/* Site Tag line (top of each page under page title) */ | |||
#siteSub { | |||
display: inline; | |||
font-size: 85%; | |||
font-weight: normal; | |||
font-style: normal; | |||
text-align: right; | |||
} | |||
.simpleborder { | |||
border: 1px #aaaaaa solid; | |||
padding: 3px; | |||
} | |||
.center { | |||
text-align: center; | |||
width: 100%; | |||
} | |||
/* Used for {{main||}} template to out-dent and italicize, from Wikipedia */ | |||
.rellink, .dablink { | |||
font-style: italic; | |||
margin-bottom: 0.5em; | |||
padding-left: 1.6em; | |||
} | |||
/* Highlight text with yellow background without making a border. Can be used within Quote boxes as well */ | |||
.wiHighlight { | |||
background: #fff8cc; | |||
border-bottom: 1px solid #ffe222; | |||
padding-left: .3em; | |||
padding-right: .3em; | |||
font-weight: normal; | |||
} | } |
Revision as of 18:37, 25 December 2018
/* CSS placed here will affect users of the mobile site */ /** 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 [https://grafana.wikimedia.org/dashboard/db/mobile-2g 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#Request%3A_Add_template_styles_to_existing_stylesheet]]) == 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-accountcreator.css]] and [[MediaWiki:Group-autoconfirmed.css]]. */ .sysop-show, .accountcreator-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 DO NOT style infobox's here. That should be taken care of in the associated templates via template styles. Styles here will lead to flash of unstyled content on mobile. */ /* 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 <ref group="Note"> --> "[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; } /* hidden sortkey for tablesorter */ td .sortkey, th .sortkey { display: none; speak: none; } /* 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; } /* Divs for changing the main page from tables to css */ .divTable{ display: table; width: 100%; } .divTableRow { display: table-row; } .divTableHeading { background-color: #EEE; display: table-header-group; } .divTableCell, .divTableHead { border: 0px solid #999999; display: table-cell; padding: 3px 10px; } .divTableHeading { background-color: #EEE; display: table-header-group; font-weight: bold; } .divTableFoot { background-color: #EEE; display: table-footer-group; font-weight: bold; } .divTableBody { display: table-row-group; } /* Quote boxes */ .quotes { background: none repeat scroll 0 0 #F5FDFE; border: 1px solid #A8A8A8; margin-bottom: 10px; margin-left: 14px; padding: 6px; overflow: hidden; } /* Indented quotes without borders */ .indentedquotes { margin-left: 30px; margin-right: 30px; margin-bottom: 10px; } /* Small text Refs at bottom right within quote boxes */ .quotes_ref { font-size: 85%; text-align: right; } /* Box for Core articles */ .core_box { background: none repeat scroll 0 0 #F9F9F9; border: 1px solid #AAAAAA; clear: both; float: right; font-size: 85%; margin: 15px; padding: 0.3em; width: 260px; } /* Site Tag line (top of each page under page title) */ #siteSub { display: inline; font-size: 85%; font-weight: normal; font-style: normal; text-align: right; } .simpleborder { border: 1px #aaaaaa solid; padding: 3px; } .center { text-align: center; width: 100%; } /* Used for {{main||}} template to out-dent and italicize, from Wikipedia */ .rellink, .dablink { font-style: italic; margin-bottom: 0.5em; padding-left: 1.6em; } /* Highlight text with yellow background without making a border. Can be used within Quote boxes as well */ .wiHighlight { background: #fff8cc; border-bottom: 1px solid #ffe222; padding-left: .3em; padding-right: .3em; font-weight: normal; }