mediawiki-skins-MinervaNeue/resources/skins.minerva.tablet.styles/common.less
jdlrobson 231e68703b Caption should inherit background from table
Since we are fiddling with the default display of table's we need
to declare background of captions explicitly to avoid glitchy
behaviour.

Bug: T170344
Change-Id: I0797d346315c87861075f273baac5acf4e9998cb
2017-08-24 18:03:58 +00:00

150 lines
2.8 KiB
Plaintext

/*
A file for css that optimises the Minerva skin on larger devices.
*/
@import 'minerva.variables';
@import 'minerva.mixins';
@paddingVertical: 1.4em;
@media screen and ( min-width: @deviceWidthTablet ) {
.client-js {
#searchIcon {
display: none;
}
}
.header {
.branding-box {
width: @brandingBoxWidth;
}
.search-box {
display: table-cell;
width: auto;
.search {
width: @searchBoxWidth;
}
}
}
.toc-mobile {
// Reset the rule for mobile mode (but not for .client-nojs)
display: block;
visibility: visible;
position: relative;
font-size: 1.3em;
float: left;
clear: left;
margin: 1em 0;
border: solid 1px transparent;
> h2 {
visibility: hidden;
font-family: @fontFamily;
font-size: @tocFontSize;
font-weight: bold;
border-bottom: 0;
padding: @paddingVertical / 2 0;
}
}
.content_block {
width: auto;
clear: none;
}
// FIXME: Have a class that identifies all of these selectors
.pre-content,
.content,
.post-content {
max-width: @contentMaxWidthTablet;
margin: 0 @contentPaddingTablet;
}
.content {
// Classes added by thumbnails
// e.g. [[File:Scholars mate animation.gif|frame|left|"[[Scholar's mate]]"]]
// We use @noflip because we still want .tleft to be on the left and
// .tright to be on the right in RTL languages.
figure,
.thumb {
width: 320px;
&.mw-halign-left,
&.tleft {
/* @noflip */
float: left;
/* @noflip */
clear: left;
/* @noflip */
margin-right: 1.4em;
}
&.mw-default-size,
&.mw-halign-right,
&.tright {
/* @noflip */
float: right;
/* @noflip */
clear: right;
/* @noflip */
margin-left: 1.4em;
}
}
// Override rules in common.less
table {
display: table;
width: auto !important;
caption {
background: inherit; // T170344
display: table-caption;
}
tbody {
display: table-row-group;
}
}
}
#mw-mf-last-modified {
padding: 5px 0;
}
.last-modified-bar {
background-color: transparent;
padding-left: 0;
padding-right: 0;
font-size: 1em;
}
}
@media screen and ( min-width: @wgMFDeviceWidthDesktop ) {
// FIXME: Zero should use banner-container class or better - append to banner-container
#mw-mf-page-center .mw-mf-banner,
.banner-container,
// FIXME: Generic header class needed me-thinks!
.header,
.page-header-bar,
.content-header,
.overlay-header,
// FIXME: Generic content class needed?
.content,
.overlay-content,
.content-unstyled,
.pre-content,
.post-content,
// FIXME: remove need for id selector
#mw-mf-page-center .pointer-overlay {
margin-left: auto;
margin-right: auto;
max-width: @contentMaxWidthTablet;
}
.header {
// Make sure the main menu and secondary button icon images are aligned
// with the content.
max-width: @contentMaxWidthTablet + 2 * @iconGutterWidth;
}
}