You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
149 lines
2.2 KiB
149 lines
2.2 KiB
.animate__animated {
|
|
animation-duration: 0.5s;
|
|
animation-fill-mode: both;
|
|
}
|
|
|
|
@keyframes zoomIn {
|
|
from {
|
|
opacity: 0;
|
|
-webkit-transform: scale3d(0.3, 0.3, 0.3);
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
|
|
50% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.animate__zoomIn {
|
|
animation-name: zoomIn;
|
|
}
|
|
|
|
@keyframes bounce {
|
|
|
|
from,
|
|
20%,
|
|
53%,
|
|
to {
|
|
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
40%,
|
|
43% {
|
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
|
transform: translate3d(0, -30px, 0) scaleY(1.1);
|
|
}
|
|
|
|
70% {
|
|
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
|
|
transform: translate3d(0, -15px, 0) scaleY(1.05);
|
|
}
|
|
|
|
80% {
|
|
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
transform: translate3d(0, 0, 0) scaleY(0.95);
|
|
}
|
|
|
|
90% {
|
|
transform: translate3d(0, -4px, 0) scaleY(1.02);
|
|
}
|
|
}
|
|
|
|
.animate__bounce {
|
|
animation-name: bounce;
|
|
transform-origin: center bottom;
|
|
}
|
|
|
|
@keyframes rubberBand {
|
|
from {
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
|
|
30% {
|
|
transform: scale3d(1.25, 0.75, 1);
|
|
}
|
|
|
|
40% {
|
|
transform: scale3d(0.75, 1.25, 1);
|
|
}
|
|
|
|
50% {
|
|
transform: scale3d(1.15, 0.85, 1);
|
|
}
|
|
|
|
65% {
|
|
transform: scale3d(0.95, 1.05, 1);
|
|
}
|
|
|
|
75% {
|
|
transform: scale3d(1.05, 0.95, 1);
|
|
}
|
|
|
|
to {
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
|
|
.animate__rubberBand {
|
|
animation-name: rubberBand;
|
|
}
|
|
|
|
@keyframes bounceIn {
|
|
|
|
from,
|
|
20%,
|
|
40%,
|
|
60%,
|
|
80%,
|
|
to {
|
|
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
|
|
}
|
|
|
|
0% {
|
|
opacity: 0;
|
|
transform: scale3d(0.3, 0.3, 0.3);
|
|
}
|
|
|
|
20% {
|
|
transform: scale3d(1.1, 1.1, 1.1);
|
|
}
|
|
|
|
40% {
|
|
transform: scale3d(0.9, 0.9, 0.9);
|
|
}
|
|
|
|
60% {
|
|
opacity: 1;
|
|
transform: scale3d(1.03, 1.03, 1.03);
|
|
}
|
|
|
|
80% {
|
|
transform: scale3d(0.97, 0.97, 0.97);
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
transform: scale3d(1, 1, 1);
|
|
}
|
|
}
|
|
|
|
.animate__bounceIn {
|
|
animation-name: bounceIn;
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0;
|
|
}
|
|
|
|
to {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.animate__fadeIn {
|
|
animation-name: fadeIn;
|
|
}
|