/** * Animation mixin. */ @mixin animation($animate...) { $max: length($animate); $animations: ''; @for $i from 1 through $max { $animations: #{$animations + nth($animate, $i)}; @if $i < $max { $animations: #{$animations + ", "}; } } -webkit-animation: $animations; -moz-animation: $animations; -o-animation: $animations; animation: $animations; } /** * Keyframes mixin. */ @mixin keyframes($animationName) { @-webkit-keyframes #{$animationName} { @content; } @-moz-keyframes #{$animationName} { @content; } @-o-keyframes #{$animationName} { @content; } @keyframes #{$animationName} { @content; } } @mixin transform($func) { -moz-transform: $func; -ms-transform: $func; -webkit-transform: $func; -o-transform: $func; transform: $func; } @mixin transition($transition...) { -moz-transition: $transition; -o-transition: $transition; -webkit-transition: $transition; transition: $transition; }