mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-12-22 10:33:24 +00:00
6f98cc6460
Remove direct usage of CSS variables in Minerva, and replace them with codex design tokens again. Document this decision in the original ADR Note: there are still a small number of CSS variables in use, including most notably the --color-link-red fix, which broke when I removed it, but this change takes care of all the ones that could be easily replaced Bug: T363743 Change-Id: I7d3a9dceb908167078987de1733774c8bd4bea2f
44 lines
1.1 KiB
Plaintext
44 lines
1.1 KiB
Plaintext
@import '../../minerva.less/minerva.variables.less';
|
|
@import '../../minerva.less/minerva.mixins.less';
|
|
|
|
// Only applies to mobile Minerva. For this reason these rules should likely be moved to
|
|
// `mobile.init.styles` either as a skin style or default style.
|
|
.lazy-image-placeholder {
|
|
background-color: @background-color-interactive;
|
|
|
|
// If the placeholder itself is inside an inline element do not use block
|
|
// See https://phabricator.wikimedia.org/T143558
|
|
// and https://phabricator.wikimedia.org/T144567
|
|
li &,
|
|
span & {
|
|
display: inline-block;
|
|
}
|
|
|
|
// The image placeholder for shouldn't show for no-js devices
|
|
.client-nojs & {
|
|
display: none;
|
|
}
|
|
|
|
// In order to avoid reflows placeholder needs to be inline-block
|
|
// Otherwise display block will always take up the full line
|
|
// instead of allowing text before and after
|
|
// see T146298
|
|
display: inline-block;
|
|
// See T199351#6370886
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.content {
|
|
a > .lazy-image-placeholder {
|
|
// make sure that images in articles don't cause a horizontal scrollbar
|
|
// on small screens
|
|
max-width: 100% !important;
|
|
}
|
|
}
|
|
|
|
@media print {
|
|
.lazy-image-placeholder {
|
|
page-break-inside: avoid;
|
|
}
|
|
}
|