mediawiki-extensions-Multim.../resources/mmv/mmv.mixins.less
Trevor Parscal a8838e4bae Update OOjs UI Class Names (549ff9ab7d)
Changes were generated by running this script:
https://gist.github.com/trevorparscal/92ccdc4c49ab033d9ba8

File content changes:
Scripts (*.js)
- TextInputMenuWidget → TextInputMenuSelectWidget
- MenuWidget → MenuSelectWidget
- MenuItemWidget → MenuOptionWidget
- MenuSectionItemWidget → MenuSectionOptionWidget
- OutlineWidget → OutlineSelectWidget
- OutlineItemWidget → OutlineOptionWidget
Styles (*.less)
- textInputMenuWidget → textInputMenuSelectWidget
- menuWidget → menuSelectWidget
- menuItemWidget → menuOptionWidget
- menuSectionItemWidget → menuSectionOptionWidget
- outlineWidget → outlineSelectWidget
- outlineItemWidget → outlineOptionWidget

Change-Id: I19ad3990837c0c565773fbb4c3d9d4d18e5f616e
2014-11-20 01:04:32 +00:00

77 lines
3.6 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;
-ms-user-select: none;
user-select: none;
}
.opacity(@value) {
opacity: @value;
filter: e(%("alpha(opacity=%s)", round(@value * 100))); // IE6-8
zoom: 1; // IE 6-7 hasLayout hack
}
// from http://stackoverflow.com/a/12178019/323407
.fade-out-vertical(@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='#%s', endColorstr='#%s',GradientType=0 )",
rgbahex(@invisible), rgbahex(@backgroundColor))); // IE6-9
}
.fade-out-horizontal(@backgroundColor: white) {
@invisible: fadeout(@backgroundColor, 100%);
background-image: linear-gradient(to right, @invisible 0%, @backgroundColor 100%); // W3C
background-image: -moz-linear-gradient(left, @invisible 0%, @backgroundColor 100%); // FF3.6+
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, @invisible),
color-stop(100%, @backgroundColor)); // Chrome,Safari4+
background-image: -webkit-linear-gradient(left, @invisible 0%, @backgroundColor 100%); // Chrome10+,Safari5.1+
background-image: -o-linear-gradient(left, @invisible 0%, @backgroundColor 100%); // Opera 11.10+
background-image: -ms-linear-gradient(left, @invisible 0%, @backgroundColor 100%); // IE10+
filter: e(%("progid:DXImageTransform.Microsoft.gradient( startColorstr='#%s', endColorstr='#%s',GradientType=1 )",
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))";
// The filter rules (which are for IE < 9) cause a bug in IE 9 where the rotated
// element will have a black background. So we have to disable them in IE9
filter: none \0/IE9;
-ms-filter: none \0/IE9;
}
// from http://pixelhunter.me/post/25782670606/css3-grayscale
.grayscale() {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
filter: grayscale(100%);
filter: gray; // IE 6-9
}