mediawiki-skins-Vector/resources/skins.vector.styles/skin.less
Jon Robson c269419af3 Disable animations when user prefers reduced motion
When browser preference for reduced motion is enabled:
* Disables bolding of table of contents
* Disables sticky header transition

Bug: T254399
Change-Id: I8ef9e59b258fed977ce370da352b1924832d842b
2022-04-26 23:31:38 +00:00

52 lines
1.4 KiB
Plaintext

/**
* Vector modern stylesheets
* See '../common/common.less' for common screen and print Vector stylesheets.
*/
@import '../common/variables.less';
@import 'mediawiki.mixins.less';
@media screen {
// Layouts
@import './layouts/screen.less';
// Components
@import './components/SearchBoxLoader.less';
@import './components/VueEnhancedSearchBox.less';
@import './components/Sidebar.less';
@import './components/LanguageButton.less';
@import './components/UserLinks.less';
@import './components/Header.less';
@import './components/StickyHeader.less';
@import './components/TableOfContents.less';
}
@media all {
// Component styles that should apply in all media.
@import './components/Logo.less';
}
@media print {
@import './layouts/print.less';
}
/**
* Respect users who prefer reduced motion.
* This code can be removed if and when it is upstreamed to ResourceLoaderSkinModule
* (see T254399).
*/
/* stylelint-disable declaration-no-important, time-min-milliseconds */
@media ( prefers-reduced-motion: reduce ) {
*,
:before,
:after {
animation-delay: -1ms !important; /* 1 */
animation-duration: 1ms !important; /* 1 */
animation-iteration-count: 1 !important; /* 1 */
background-attachment: initial !important; /* 2 */
scroll-behavior: auto !important; /* 3 */
transition-delay: 0s !important; /* 4 */
transition-duration: 0s !important; /* 4 */
}
}