Skip to content

Instantly share code, notes, and snippets.

@bizikov
Last active July 19, 2017 08:43
Show Gist options
  • Save bizikov/9308043 to your computer and use it in GitHub Desktop.
Save bizikov/9308043 to your computer and use it in GitHub Desktop.
Список из кроссбраузерных примешиваний для LESS
/* gradient */
.gradient(@from: #000, @to: #fff) {
background-color: @from;
background-image: -webkit-gradient(linear, left top, left bottom, from(@from), to(@to));
background-image: -webkit-linear-gradient(top, @from, @to);
background-image: -moz-linear-gradient(top, @from, @to);
background-image: -o-linear-gradient(top, @from, @to);
background-image: linear-gradient(to bottom, @from, @to);
}
/* opacity */
.opacity (@opacity: 0.5) {
-webkit-opacity: @opacity;
-moz-opacity: @opacity;
opacity: @opacity;
}
/* box shadow */
.box-shadow(@insert, @x: 0, @y: 0, @blur: 10px, @color: #666) when (@insert = false) {
-webkit-box-shadow: inset @x @y @blur @color;
box-shadow: inset @x @y @blur @color;
}
.box-shadow(@insert, @x: 0, @y: 0, @blur: 10px, @color: #666) when (@insert = true) {
-webkit-box-shadow: @x @y @blur @color;
box-shadow: @x @y @blur @color;
}
.box-shadow(@x: 0, @y: 0, @blur: 10px, @color: #666){
-webkit-box-shadow: @arguments;
box-shadow: @arguments;
}
/* text shadow */
.text-shadow(@x: 1px, @y: 1px, @radius: 2px, @color: #000){
-webkit-text-shadow: @arguments;
-moz-text-shadow: @arguments;
text-shadow: @arguments;
}
/* box sizing */
.box-sizing (@type: border-box) {
-webkit-box-sizing: @type;
-moz-box-sizing: @type;
box-sizing: @type;
}
/* border radius */
.border-radius(@r: 3px) {
-webkit-border-radius: @r;
-moz-border-radius: @r;
border-radius: @r;
}
/* column */
.column(@count: 3, @gap: 1em) {
-webkit-column-count: @count; -webkit-column-gap: @gap;
-moz-column-count: @count; -moz-column-gap: @gap;
column-count: @count; column-gap: @gap;
}
.transition(@property: all, @duration: 0.3s, @function: linear) {
-webkit-transition: @arguments;
-moz-transition: @arguments;
-o-transition: @arguments;
transition: @arguments;
}
.transform(@value) {
-webkit-transform: @value;
-moz-transform: @value;
-ms-transform: @value;
-o-transform: @value;
transform: @value;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment