2020-04-14 21:10:44 +02:00
|
|
|
@mixin pin()
|
2020-04-12 17:38:51 +02:00
|
|
|
position: fixed
|
|
|
|
top: 0
|
|
|
|
left: 0
|
|
|
|
right: 0
|
|
|
|
bottom: 0
|
2020-04-14 21:10:44 +02:00
|
|
|
|
2020-04-14 22:31:13 +02:00
|
|
|
@mixin sizeCube($size: 1rem)
|
|
|
|
width: $size
|
|
|
|
height: $size
|
|
|
|
|
2020-04-14 21:50:39 +02:00
|
|
|
/*
|
|
|
|
* $size: all, top, right, bottom, left
|
|
|
|
*/
|
|
|
|
@mixin border($size: 1px, $color: black, $side: all)
|
|
|
|
border: 0
|
|
|
|
-webkit-appearance: none
|
|
|
|
@if $side == 'all'
|
|
|
|
box-shadow: inset 0 0 0 $size $color
|
|
|
|
@else if $side == 'top'
|
|
|
|
box-shadow: inset 0 $size 0 0 $color
|
|
|
|
@else if $side == 'right'
|
|
|
|
box-shadow: inset -#{$size} 0 0 0 $color
|
|
|
|
@else if $side == 'left'
|
|
|
|
box-shadow: inset $size 0 0 0 $color
|
|
|
|
@else if $side == 'bottom'
|
|
|
|
box-shadow: inset 0 -#{$size} 0 0 $color
|
|
|
|
|
2020-04-14 21:10:44 +02:00
|
|
|
@mixin animationRotate($speed: 1s)
|
2020-04-14 22:31:13 +02:00
|
|
|
$id: unique-id()
|
|
|
|
@keyframes#{$id}
|
2020-04-14 21:10:44 +02:00
|
|
|
from
|
|
|
|
transform: rotate(0)
|
|
|
|
to
|
|
|
|
transform: rotate(360deg)
|
|
|
|
animation:
|
|
|
|
name: animationRotate
|
|
|
|
duration: $speed
|
|
|
|
iteration-count: infinite
|
|
|
|
timing-function: linear
|
2020-04-14 21:31:10 +02:00
|
|
|
|
2020-04-14 22:12:12 +02:00
|
|
|
@mixin animationPulse($speed: 1s, $size: 1rem, $color: black, $iteration: infinite)
|
2020-04-14 22:31:13 +02:00
|
|
|
$id: unique-id()
|
|
|
|
@keyframes #{$id}
|
2020-04-14 21:31:10 +02:00
|
|
|
from
|
2020-04-14 21:31:30 +02:00
|
|
|
box-shadow: 0 0 0 0 $color
|
2020-04-14 21:31:10 +02:00
|
|
|
to
|
2020-04-14 21:31:30 +02:00
|
|
|
box-shadow: 0 0 0 $size transparentize($color, 1)
|
2020-04-14 21:31:10 +02:00
|
|
|
animation:
|
2020-04-14 22:31:13 +02:00
|
|
|
name: $id
|
2020-04-14 21:31:10 +02:00
|
|
|
duration: $speed
|
2020-04-14 22:12:12 +02:00
|
|
|
iteration-count: $iteration
|
2020-04-14 21:31:10 +02:00
|
|
|
timing-function: linear
|