45 lines
758 B
SCSS
45 lines
758 B
SCSS
@keyframes jump-animation {
|
|
0% {
|
|
//transform: rotate(#{$startDegree}deg);
|
|
transform: scale(1);
|
|
}
|
|
50% {
|
|
transform: scale(2);
|
|
}
|
|
100% {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
.jump-animation {
|
|
animation-name: jump-animation;
|
|
animation-duration: 0.4s;
|
|
animation-fill-mode: none;
|
|
animation-timing-function: linear;
|
|
}
|
|
|
|
$deg: 10deg;
|
|
|
|
@keyframes shake {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
33% {
|
|
transform: rotate(-$deg);
|
|
}
|
|
66% {
|
|
transform: rotate($deg);
|
|
}
|
|
100% {
|
|
transform: rotate(0deg);
|
|
}
|
|
}
|
|
|
|
.shake .leaf-element {
|
|
|
|
/* Start the shake animation and make the animation last for 0.5 seconds */
|
|
animation: shake 0.15s;
|
|
|
|
/* When the animation is finished, start again */
|
|
animation-iteration-count: infinite;
|
|
} |