|
|
@ -0,0 +1,40 @@ |
|
|
|
/** |
|
|
|
* animation |
|
|
|
* |
|
|
|
* |
|
|
|
* |
|
|
|
* @author Björn Hase |
|
|
|
* |
|
|
|
*/ |
|
|
|
|
|
|
|
@mixin crispy-boilerplate-animation() { |
|
|
|
.--animation-rotate { |
|
|
|
animation: spin 3s linear infinite; |
|
|
|
|
|
|
|
@keyframes spin { |
|
|
|
to { |
|
|
|
transform: rotate(360deg); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.--animation-shake { |
|
|
|
animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both; |
|
|
|
transform: translate3d(0, 0, 0); |
|
|
|
|
|
|
|
@keyframes shake { |
|
|
|
10%, 90% { |
|
|
|
transform: translate3d(-1px, 0, 0); |
|
|
|
} |
|
|
|
20%, 80% { |
|
|
|
transform: translate3d(2px, 0, 0); |
|
|
|
} |
|
|
|
30%, 50%, 70% { |
|
|
|
transform: translate3d(-4px, 0, 0); |
|
|
|
} |
|
|
|
40%, 60% { |
|
|
|
transform: translate3d(4px, 0, 0); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |