mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-11-16 18:58:45 +00:00
0d61c78f73
This could be made even simpler by not using a LESS varialbe for
hacks.less, but loading it conditionally through the moduel def.
But, as a first step we can merge the two as-is.
Given that the subject and target are always referenced together
in page views, there is no need to keep an alias around. However,
I'm keeping it anyway so as to not produce any
`/* {"skins.foo":"missing"} */` appendix to the stylesheet response
for these cached URLs.
Bug: T266361
Change-Id: I8578faab8ca32bd49be90711cbd5e182763b8065
75 lines
1.9 KiB
Plaintext
75 lines
1.9 KiB
Plaintext
@import '../../../minerva.less/minerva.variables.less';
|
|
@import '../../../minerva.less/minerva.mixins.less';
|
|
@import 'toc.less';
|
|
|
|
// Content formatting and typography
|
|
//
|
|
// Our content is predominately text, hence visual hierarchy must be clear.
|
|
|
|
body {
|
|
font-family: @font-family-base;
|
|
line-height: 1.4;
|
|
-webkit-tap-highlight-color: rgba( 0, 0, 0, 0.2 );
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.content {
|
|
line-height: @line-height-content;
|
|
// Deal with long links (bug 60387)
|
|
word-wrap: break-word;
|
|
|
|
/* Emulate Center - from mediawiki.skinning/elements.css */
|
|
.center {
|
|
width: 100%;
|
|
text-align: center;
|
|
|
|
> *,
|
|
.thumb {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Feature phones < 320px viewport receive smaller font.
|
|
@media all and ( max-width: @width-breakpoint-mobile - 1 ) {
|
|
html {
|
|
font-size: @font-size-root--feature-phone;
|
|
}
|
|
|
|
.content {
|
|
margin: 0 12px;
|
|
}
|
|
}
|
|
|
|
.nomobile {
|
|
// No mobile should trump any other class. e.g. .content table { display: table; }
|
|
display: none !important;
|
|
}
|
|
|
|
// Support iOS 9+ browsers: Enable Dynamic Type resizing, see
|
|
// http://www.interactiveaccessibility.com/blog/text-resizing-web-pages-ios-using-dynamic-type
|
|
// & T204807.
|
|
@supports ( font: -apple-system-body ) {
|
|
html {
|
|
font: -apple-system-body; // stylelint-disable-line font-family-no-missing-generic-family-keyword
|
|
}
|
|
|
|
// Most iOS browsers' default font size is 16px but Dynamic Type's default
|
|
// font size is 17px. We need to scale down @font-size-root and
|
|
// @font-size-root--feature-phone by this ratio in order to make them relative to these
|
|
// browsers' defaults again. By doing this, the default Dynamic Type text size
|
|
// will appear identical to the browser's default text size.
|
|
@dynamicTypeScalingFactor: 16 / 17;
|
|
|
|
body {
|
|
font-size: @font-size-root * @dynamicTypeScalingFactor;
|
|
}
|
|
|
|
@media all and ( max-width: @width-breakpoint-mobile - 1 ) {
|
|
body {
|
|
font-size: @font-size-root--feature-phone * @dynamicTypeScalingFactor;
|
|
}
|
|
}
|
|
}
|