mixins-base/_mixins.sass

48 lines
1.1 KiB
Sass
Raw Normal View History

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 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)
@keyframes animationRotate
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
@mixin animationPulse($speed: 1s, $size: 1rem, $color: black)
@keyframes animationPulse
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:
name: animationPulse
duration: $speed
iteration-count: infinite
timing-function: linear