mediawiki-skins-Vector/resources/skins.vector.styles/watchstar-ie8.less
Timo Tijhof 87a1d25079 watchstar: Remove PNG fallback for watchstar icon
Instead, for the subset of Grade C browsers without SVG support (currently
IE8), we remove the icon and display the label text instead –
in a hacky, but acceptable way.

Bug: T248062
Change-Id: I87660b69fe65b9ec2989ea606e5f76d427c28fee
2020-04-03 20:49:39 +01:00

33 lines
961 B
Plaintext

/*!
* Convert watchstar to text label in IE 8.
*
* Hide the SVG icon and show the text label instead.
* This is in a separate file because it uses a
* @media query, which can't be nested, so we need to include
* this outside the overall '@media screen'.
*/
// stylelint-disable no-duplicate-selectors
// Support IE 8: Show label instead (Grade C).
// See https://stackoverflow.com/a/17699986/1696030
// https://keithclark.co.uk/articles/moving-ie-specific-css-into-media-blocks/media-tests/
@ie8-media-start: ~'@media \0screen {';
@ie8-media-end: ~'} after';
@{ie8-media-start}
.vectorTabs .mw-watchlink.icon a {
width: auto;
height: auto;
// Copied from 'VectorTabs.less'.
padding: 1.25em 8px 0 8px;
}
// LESS nesting doesn't work in this hack.
.vectorTabs .mw-watchlink.icon a:before {
display: none;
}
// Bogus extra rule for LESS compiler to render `@media` ending bracket.
@{ie8-media-end} {
/* This comment makes the block non-empty. */
}