45 lines
819 B
CSS
45 lines
819 B
CSS
:root {
|
|
--animate-duration: 1s;
|
|
}
|
|
|
|
.animate__animated {
|
|
animation-duration: var(--animate-duration);
|
|
animation-fill-mode: both;
|
|
}
|
|
|
|
.animate__faster {
|
|
animation-duration: calc(var(--animate-duration) / 2);
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
0% { opacity: 0; }
|
|
to { opacity: 1; }
|
|
}
|
|
|
|
.animate__fadeIn {
|
|
animation-name: fadeIn;
|
|
}
|
|
|
|
@keyframes fadeOut {
|
|
0% { opacity: 1; }
|
|
to { opacity: 0; }
|
|
}
|
|
|
|
.animate__fadeOut {
|
|
animation-name: fadeOut;
|
|
}
|
|
|
|
@keyframes heartBeat {
|
|
0% { transform: scale(1); }
|
|
14% { transform: scale(1.3); }
|
|
28% { transform: scale(1); }
|
|
42% { transform: scale(1.3); }
|
|
70% { transform: scale(1); }
|
|
}
|
|
|
|
.animate__heartBeat {
|
|
animation-name: heartBeat;
|
|
animation-duration: calc(var(--animate-duration) * 1.3);
|
|
animation-timing-function: ease-in-out;
|
|
}
|