mediawiki-extensions-Multim.../resources/mmv/mmv.mixins.less
Gergő Tisza 47a8bda392 Create StripeButtons class, convert reuse button to use it
Also do a bunch of refactoring to:
* keep LESS rules in more sane locations so it is not as hard to get an overview
  (most of the metadata panel rules were in mmv.less)
* move mmv.mixins.less up one directory as it is not specific to the UI
* move the SVG icons as all of them were related to the UI
* remove the marging-right hack which was used to keep the title text from
  overflowing the button; instead use a float and overflow properties to make
  sure text that is too long gets hidden

Change-Id: Icc8ea2e766be67d86ae98c734721b2185bd6c36e
2014-04-03 23:13:12 +00:00

41 lines
1.9 KiB
Plaintext

// from http://css3please.com/
.box-round(@radius) {
-webkit-border-radius: @radius; // Android ≤ 1.6, iOS 1-3.2, Safari 3-4
border-radius: @radius; // Android 2.1+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 5+
// useful if you don't want a bg color from leaking outside the border:
background-clip: padding-box; // Android 2.2+, Chrome, Firefox 4+, IE 9+, iOS 4+, Opera 10.50+, Safari 4+
}
.unselectable() {
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none;
}
// from http://stackoverflow.com/a/12178019/323407
.fade-out(@backgroundColor: white) {
@invisible: fadeout(@backgroundColor, 100%);
background-image: linear-gradient(to bottom, @invisible 0%, @backgroundColor 100%); // W3C
background-image: -moz-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // FF3.6+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @invisible),
color-stop(100%, @backgroundColor)); // Chrome,Safari4+
background-image: -webkit-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Chrome10+,Safari5.1+
background-image: -o-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // Opera 11.10+
background-image: -ms-linear-gradient(top, @invisible 0%, @backgroundColor 100%); // IE10+
filter: e(%("progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 )",
rgbahex(@invisible), rgbahex(@backgroundColor))); // IE6-9
}
.rotate(@degrees: 45deg) {
-webkit-transform: rotate(@degrees);
-moz-transform: rotate(@degrees);
-ms-transform: rotate(@degrees);
-o-transform: rotate(@degrees);
transform: rotate(@degrees);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=(@degrees / 90.0));
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=(@degrees / 90.0))";
}