MediaWiki:Gadget-LessMixins.less
Jump to navigation
Jump to search
/**
* Standard mixins for Less v2
*
* Based on <https://github.com/clearleft/clearless/blob/master/mixins/helpers.less>
* Gradients based on <https://www.colorzilla.com/gradient-editor/>
*/
.border-radius( @radius: 5px) {
border-radius: @radius;
}
.box-sizing( @type: border-box) {
box-sizing: @type;
}
.box-shadow( @shadow: 1px 1px 2px rgba( 0, 0, 0, 0.25)) {
box-shadow: @shadow;
}
.filter( @filter: grayscale( 100%)) {
-webkit-filter: @filter;
filter: @filter;
}
.transition( @transition ) {
transition: @transition;
}
.rotate( @rotation ) {
transform: rotate( @rotation );
}
.user-select( @value ) {
-webkit-user-select: @value;
-moz-user-select: @value;
-ms-user-select: @value;
user-select: @value;
}
// @todo add extra options beyond basic horizontal and vertical
#gradient {
.horizontal ( @start-color, @end-color, @start-percent: 0%, @end-percent: 100%) {
background: linear-gradient( to right, @start-color @start-percent, @end-color @end-percent );
}
.vertical ( @start-color, @end-color, @start-percent: 0%, @end-percent: 100%) {
background: linear-gradient( to bottom, @start-color @start-percent, @end-color @end-percent );
}
}