1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- /**
- * 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 circle($diameter) {
- width: $diameter;
- height: $diameter;
- border-radius: 50%;
- }
-
- @mixin absoluteAligning($sizeX, $sizeY) {
- top: 50%;
- left: 50%;
- position: absolute;
- @include transform(translate(-#{$sizeX / 2}, -#{$sizeY / 2}))
- }
-
- @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;
- }
|