Sha256: 77a1fe86bd8ece9d01a7153d10735fcfda9c7618a10b782c9c4c251e771d6422
Contents?: true
Size: 755 Bytes
Versions: 33
Compression:
Stored size: 755 Bytes
Contents
/// Creates a spinning animation.
/// @param {Keyword} $direction [cw] - Direction to spin. Should be `cw` (clockwise) or `ccw` (counterclockwise).
/// @param {Number} $amount [360deg] - Amount to spin. Can be any CSS angle unit.
/// @return {Map} A keyframes map that can be used with the `generate-keyframes()` mixin.
@function spin(
$state: in,
$direction: cw,
$amount: 1turn
) {
$start: 0;
$end: 0;
@if $state == in {
$start: if($direction == ccw, $amount, $amount * -1);
$end: 0;
} @else {
$start: 0;
$end: if($direction == ccw, $amount * -1, $amount);
}
$keyframes: (
name: 'spin-#{$direction}-#{$amount}',
0: (transform: rotate($start)),
100: (transform: rotate($end)),
);
@return $keyframes;
}
Version data entries
33 entries across 33 versions & 4 rubygems