mediawiki-skins-MinervaNeue/resources/skins.minerva.base.styles/content/headings.less
Jon Robson ea6c55f925 Reset: Further simplify the reset
* Move pre to content/text.less
* Move heading styles to text.less
* Move search input styles to ui.less

Bug: T205341
Change-Id: I333918089af1c20e9467ad57596dd9dd6925869a
2024-02-13 18:23:28 -08:00

123 lines
2.8 KiB
Plaintext

// Headings in mobile
//
// All headings styled in the content div will be styled like so.
//
// Markup:
// <div class="pre-content">
// <h1 id="mw-first-heading">Heading 1</h1>
// </div>
// <div class="content">
// <p>Paragraph of text</p>
// <div class="mw-heading mw-heading2"><h2>Heading 2</h2></div>
// <p>Paragraph of text</p>
// <div class="mw-heading mw-heading3"><h3>Heading 3</h3></div>
// <p>Paragraph of text</p>
// <div class="mw-heading mw-heading4"><h4>Heading 4</h4></div>
// <p>Paragraph of text</p>
// <div class="mw-heading mw-heading5"><h5>Heading 2</h5></div>
// <p>Paragraph of text</p>
// <div class="mw-heading mw-heading6"><h6>Heading 2</h6></div>
// <p>Paragraph of text</p>
// </div>
//
// Alternative markup (pre-T13555):
// <div class="content">
// <p>Paragraph of text</p>
// <h2><span class="mw-headline">Heading 2</span></h2>
// <p>Paragraph of text</p>
// <h3><span class="mw-headline">Heading 3</span></h3>
// <p>Paragraph of text</p>
// <h4><span class="mw-headline">Heading 4</span></h4>
// <p>Paragraph of text</p>
// <h5><span class="mw-headline">Heading 2</span></h5>
// <p>Paragraph of text</p>
// <h6><span class="mw-headline">Heading 2</span></h6>
// <p>Paragraph of text</p>
// </div>
@import 'mediawiki.mixins.less';
@import '../../../minerva.less/minerva.variables.less';
@import '../../../minerva.less/minerva.mixins.less';
h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font: inherit;
}
.mw-heading1,
h1 {
font-size: @font-size-h1;
}
.mw-heading2,
h2 {
font-size: @font-size-h2;
}
.mw-heading3,
h3 {
font-size: @font-size-h3;
font-weight: bold;
}
.mw-heading4,
h4 {
font-weight: bold;
}
.pre-content h1,
.content .mw-heading1,
.content h1,
.content .mw-heading2,
.content h2 {
font-family: @font-family-serif;
}
.pre-content h1,
.content .mw-heading1,
.content h1,
.content .mw-heading2,
.content h2,
.mw-heading3,
.mw-heading4,
.mw-heading5,
.mw-heading6,
h3, h4, h5, h6 {
line-height: @line-height-xx-small;
word-wrap: break-word;
// This value isn't valid per the specification [0] but fixes the behaviour in
// Google Chrome (45.0.2454.93), and, likely, other browsers too.
//
// [0] https://drafts.csswg.org/css-text-3/#propdef-word-break
word-break: break-word;
}
.content {
// Deliberately not applied to h1
.mw-heading2,
.mw-heading3,
.mw-heading4,
.mw-heading5,
.mw-heading6,
h2, h3, h4, h5, h6 {
padding: @margin-heading 0;
}
// `h3`s need extra `margin-top` after paragraphs, see T219572.
p + .mw-heading3,
p + h3 {
margin-top: @margin-heading * 3;
}
// Override the styles above for `hN` nested inside `.mw-heading`, as used on wikitext pages.
.mw-heading {
h1, h2, h3, h4, h5, h6 {
font-size: inherit;
line-height: inherit;
padding: 0;
margin: 0;
}
}
}