mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-12-01 17:26:36 +00:00
2cc9516cde
This is programmatic output from python3 scripts/migrate.py This will result in a Minerva skin dependent on MobileFrontend. Post merge we will rename message keys to have minerva- prefix Bug: T166748 Change-Id: Iff1f7e63e796cc5d4a6d2ab0370e0c33248d2fce
54 lines
1.1 KiB
Plaintext
54 lines
1.1 KiB
Plaintext
@import 'minerva.variables.less';
|
|
@import 'minerva.mixins.less';
|
|
@import 'mediawiki.mixins.animation';
|
|
|
|
@animationDuration: 0.3s;
|
|
@placeholderBackgroundColor: @grayLightest;
|
|
|
|
.lazy-image-placeholder {
|
|
// 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;
|
|
}
|
|
|
|
background-color: @placeholderBackgroundColor;
|
|
|
|
// 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;
|
|
}
|
|
|
|
// When the image has loaded transition background color and image opacity
|
|
// for a fade-in effect
|
|
img.image-lazy-loaded {
|
|
.animation( fadeInImage @animationDuration ease-in );
|
|
}
|
|
|
|
@-webkit-keyframes fadeInImage {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes fadeInImage {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|