frostfs-s3-gw/browser/app/less/inc/mixin.less

61 lines
1.8 KiB
Text
Raw Normal View History

/*--------------------------
User Select
----------------------------*/
.user-select(@value) {
-webkit-user-select: @value;
-moz-user-select: @value;
-ms-user-select: @value;
user-select: @value;
}
/*----------------------------------------
CSS Animations based on animate.css
-----------------------------------------*/
.animated(@name, @duration) {
-webkit-animation-name: @name;
animation-name: @name;
-webkit-animation-duration: @duration;
animation-duration: @duration;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
/*-------------------------------------------------
For loop mixin for generate custom classes
--------------------------------------------------*/
.for(@i, @n) {.-each(@i)}
.for(@n) when (isnumber(@n)) {.for(1, @n)}
.for(@i, @n) when not (@i = @n) {
.for((@i + (@n - @i) / abs(@n - @i)), @n);
}
.for(@array) when (default()) {.for-impl_(length(@array))}
.for-impl_(@i) when (@i > 1) {.for-impl_((@i - 1))}
.for-impl_(@i) when (@i > 0) {.-each(extract(@array, @i))}
/*----------------------------------------
List Loader
-----------------------------------------*/
.list-loader(@width, @height, @borderColor, @borderColorBottom) {
content: '';
width: @width;
height: @height;
border-radius: 50%;
.animated(zoomIn, 500ms);
border: 2px solid @borderColor;
border-bottom-color: @borderColorBottom;
position: absolute;
z-index: 1;
-webkit-animation: zoomIn 250ms, spin 700ms 250ms infinite linear;
animation: zoomIn 250ms, spin 700ms 250ms infinite linear;
}
/*----------------------------------------
Placeholder
-----------------------------------------*/
.placeholder(@color) {
::-webkit-input-placeholder { color: @color }
::-moz-placeholder { color: @color }
:-ms-input-placeholder { color: @color }
}