LESS Mixins: For great justice!

LESS Mixins

._wh(@x:auto, @y:auto){ width: @x; height: @y; }

._db() { display: block; }
._di() { display: inline; }
._dn() { display: none; }

._rel(){ position: relative; }
._abs(){ position: absolute; }
._fix(){ position: fixed; }

._rl(){ ._rel(); float: left; }
._rr(){ ._rel(); float: right; }

._mp(@x:0, @y:0){ margin: @x; padding: @y; }

._tl(@x:auto, @y:auto){ top: @x; left: @y; }
._tr(@x:auto, @y:auto){ top: @x; right: @y; }

._center(@top:0, @bottom:0){
	margin: @top auto @bottom;
}

._transition(@transition){
	-webkit-transition: @transition;
	-moz-transition: @transition;
	-ms-transition: @transition;
	-o-transition: @transition;
	transition: @transition;
}

._animation(@animation){
	-webkit-animation: @animation;
	-moz-animation: @animation;
	-ms-animation: @animation;
	-o-animation: @animation;
	animation: @animation;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

._doubleanimation(@animation1, @animation2){
	-webkit-animation: @animation1, @animation2;
	-moz-animation: @animation1, @animation2;
	-ms-animation: @animation1, @animation2;
	-o-animation: @animation1, @animation2;
	animation: @animation1, @animation2;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

._doubletransition(@transition1, @transition2){
	-webkit-transition: @transition1, @transition2;
	-moz-transition: @transition1, @transition2;
	-ms-transition: @transition1, @transition2;
	-o-transition: @transition1, @transition2;
	transition: @transition1, @transition2;
}

._tripletransition(@transition1, @transition2, @transition3){
	-webkit-transition: @transition1, @transition2, @transition3;
	-moz-transition: @transition1, @transition2, @transition3;
	-ms-transition: @transition1, @transition2, @transition3;
	-o-transition: @transition1, @transition2, @transition3;
	transition: @transition1, @transition2, @transition3;
}

._transitiondelay(@delay){
	-webkit-transition-delay: @delay;
	-moz-transition-delay: @delay;
	-ms-transition-delay: @delay;
	-o-transition-delay: @delay;
	transition-delay: @delay;
}

.notransition{
	-webkit-transition: none;
	-moz-transition: none;
	-ms-transition: none;
	-o-transition: none;
	transition: none;
}

._transitiontransform(@duration: 500ms){
	-webkit-transition: -webkit-transform @duration ease-in-out;
	-moz-transition: -moz-transform @duration ease-in-out;
	-ms-transition: -ms-transform @duration ease-in-out;
	-o-transition: -o-transform @duration ease-in-out;
	transition: transform @duration ease-in-out;
}

._transform(@string){
	-webkit-transform: @string;
	-moz-transform: @string;
	-ms-transform: @string;
	-o-transform: @string;
	transform: @string;
}

._scale(@factor){
	-webkit-transform: scale(@factor);
	-moz-transform: scale(@factor);
	-ms-transform: scale(@factor);
	-o-transform: scale(@factor);
	transform: scale(@factor);
}

._rotate(@deg){
	-webkit-transform: rotate(@deg);
	-moz-transform: rotate(@deg);
	-ms-transform: rotate(@deg);
	-o-transform: rotate(@deg);
	transform: rotate(@deg);
}

.arrow-down(@width:10px, @color:#000){
	border-left: @width solid transparent;
	border-right: @width solid transparent;
	border-top: @width solid @color;
}

._list-type(@type:none){
	list-style-type: @type;
}

._clearbutton(){
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 0;
	background: none;
}

._noselect(@x:none){
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;   
}

._cover(){
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
}

._contain(){
	-webkit-background-size: contain;
	-moz-background-size: contain;
	background-size: contain;
}

._rad(@color1, @color2){
	background: -webkit-radial-gradient(@color1, @color2);
	background: -moz-radial-gradient(@color1, @color2);
	background: radial-gradient(@color1, @color2);
}