EnVisageOnline/Main/Source/EnVisage/Content/stylesheets/kendo/web/common/mixins.less

169 lines
6.7 KiB
Plaintext

/*!
*/
.transition(@transition) {
transition: ~"@{transition}";
}
.flexbox() {
display: flex;
}
.flexbox(@type) {
display: ~"@{type}-flex";
}
.animation(...) {
animation: @arguments;
}
.animation-delay(...) {
animation-delay: @arguments;
}
.flex-direction(@direction) {
flex-direction: @direction;
}
.flex-wrap(@wrap) {
flex-wrap: @wrap;
}
.flex(@amount) {
flex: @amount;
}
.flex-align(@alignment) {
flex-align: @alignment;
}
.flex-align-items(@alignment) {
align-items: @alignment;
}
.flex-align-content(@alignment) {
align-content: @alignment;
}
.flex-pack(@pack) {
flex-pack: @pack;
}
.text-size-adjust(...) {
text-size-adjust: @arguments;
}
.prohibit-selection() {
user-select: none;
}
.disable-high-contrast() {
-ms-high-contrast-adjust: none;
}
.box-sizing(@sizing) {
box-sizing: @sizing;
}
.transform(...) {
transform: @arguments;
}
.transform-origin(...) {
transform-origin: @arguments;
}
.transform-style(...) {
transform-style: @arguments;
}
.transition(...) {
transition: @arguments;
}
.guarded-border-radius(@value) when (@value < 0) {
border-radius: 0;
}
.guarded-border-radius(@value) when (@value >= 0) {
border-radius: @value;
}
.box-shadow(...) {
box-shadow: @arguments;
}
.window-shadow(@shadow-color) when not (@shadow-color = transparent) {
border-color: @shadow-color;
.box-shadow(@window-shadow-style lighten(@shadow-color, 50%));
&.k-state-focused {
border-color: @shadow-color;
.box-shadow(@window-shadow-style @shadow-color);
}
}
.window-shadow(@shadow-color) when (@shadow-color = transparent) and (lightness(@widget-background-color) < 50%) {
border-color: @widget-border-color;
&.k-state-focused {
border-color: lighten(@widget-border-color, 20%);
}
}
.window-shadow(@shadow-color) when (@shadow-color = transparent) and (lightness(@widget-background-color) >= 50%) {
border-color: @widget-border-color;
&.k-state-focused {
border-color: darken(@widget-border-color, 10%);
}
}
.background-clip(@type) {
background-clip: @type;
}
.composite-background(@gradient) when (@gradient = none) {
background-image: @texture;
}
.composite-background(@gradient) when not (@gradient = none) {
background-image: @fallback-texture;
background-image: @texture, ~"linear-gradient(to bottom, @{gradient})";
}
.selection(@color) {
::selection {
background-color: @color;
text-shadow: none;
color: #fff;
}
::-moz-selection {
background-color: @color;
text-shadow: none;
color: #fff;
}
}