MediaWiki:Mobile.css
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*
[[Category:Deprecated Skins]]
CSS placed here will be applied to the mobile view regardless what the current mobile skin is.
Mobile.css is being phased out in favor of:
1. TemplateStyles, for template-specific styles (see [[:Category:Template Styles]])
2. [[MediaWiki:Gadget-Site.css]], for site-wide CSS applied to all skins (desktop and mobile)
3. Skin-specific styles ([[MediaWiki:Timeless.css]] at time of writing)
Use media queries in these files to target specific device widths.
You can use the widths defined at [[MediaWiki:Variables.css]].
*/
@import url("/w/index.php?title=MediaWiki:Timeless.css&action=raw&ctype=text/css");
.nomobile, .no-mobile {
display: none;
}
/* ***************************** Main Page ***************************** */
#mf-zw-logo img {
height: auto;
max-width: 500px;
width: 100%;
}
/* Extension:PortableInfobox generates odd HTML in the mobile view that we have to work around with CSS */
/* These styles should be removed once we migrate away from portable infoboxes */
.pi-title ~ p {
background-color: var(--mw-bg-header);
border-radius: var(--zw-border-radius-2);
padding: var(--zw-space-2);
font-size: 1.25rem;
font-weight: bold;
margin: 0;
text-align: center
}
.pi-title {
display: none
}
.pi-data:not(:first-of-type) {
background-color: var(--mw-bg-header);
border: 1px solid #4b6d8c;
border-radius: 0.5rem;
}
.skin-timeless #mw-content-text .pi-data-label {
display: none;
}
.pi-data-label ~ p {
font-weight: bold;
padding: 0.5rem;
text-align: right;
display: flex;
flex-basis: 8.5rem;
justify-content: right;
margin: 0;
border: 1px solid var(--zw-border)
}
.pi-data-value {
background-color: var(--zw-bg-infobox);
}
/* MISC */
.caption {
font-size: 12px;
}