MediaWiki:Gadget-LessMixins.less

/**

* Standard mixins for Less v2
*
* Based on <https://github.com/clearleft/clearless/blob/master/mixins/helpers.less>
* Gradients based on <http://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

1. 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 );
   }

}