mediawiki-skins-MinervaNeue/resources/skins.minerva.scripts/styles.less
Jan Drewniak be0b43042e Convert Less variable names from camelCase to snake-case
Converts all Less variable names from CamelCase to snake-case
per the MediaWiki coding conventions.

Removes the following unused Less variables, mostly
related to icons, since those were converted to Codex:
- @icon-touch-area-sm
- @icon-touch-area-md
- @min-size-icon (replaced with @size-icon-medium)
- @icon-glyph-size-sm
- @icon-size-sm
- @icon-padding-sm
- @icon-glyph-size-md
- @icon-size-md
- @margin-icon-md-labelled

Bug: T350581
Change-Id: I1b16e77942d9bea20dcc5636a63d64aa2325a173
2024-01-31 15:24:31 -08:00

73 lines
1.4 KiB
Plaintext

@import '../../minerva.less/minerva.variables.less';
@import '../../minerva.less/minerva.mixins.less';
@import 'mediawiki.mixins.less';
@import 'toc.less';
@import 'watchStar.less';
@import 'page-issues/styles.less';
@import 'Toolbar.less';
.minerva-icon--download {
.cdx-mixin-css-icon( @cdx-icon-download, #54595d );
}
.minerva-icon--listBullet {
.cdx-mixin-css-icon( @cdx-icon-list-bullet, #54595d );
}
.mw-mf-page-center__mask {
position: absolute;
top: 0;
left: 0;
right: 0;
opacity: 0;
bottom: 0;
background: @opaque;
z-index: @z-index-above-content;
// don't use display: none because it's not animatable
visibility: hidden;
transition: opacity @transition-duration-base ease-in-out;
}
.navigation-enabled {
.mw-mf-page-center__mask {
visibility: visible;
opacity: 0.5;
}
}
// Last modified bar styles
.last-modified-bar.active {
background-color: @background-color-last-modified-bar-active;
color: @color-inverted;
.last-modified-text-accent,
a {
color: @color-inverted;
}
.minerva-icon {
background-color: @color-inverted;
}
}
// Used by last modified bar and in MobileFrontend (i.e. MobileSpecialPageFeed.php, ImageCarousel.js)
.truncated-text {
.text-overflow( @visible: false );
}
@keyframes fadeInImage {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
// When the image has loaded transition background color and image opacity
// for a fade-in effect
img.image-lazy-loaded {
animation: fadeInImage 300ms ease-in;
}