69 lines
1.3 KiB
CSS
69 lines
1.3 KiB
CSS
|
.animated {
|
||
|
animation-duration: var(--animate-duration);
|
||
|
animation-fill-mode: both;
|
||
|
}
|
||
|
|
||
|
.animated.infinite {
|
||
|
animation-iteration-count: infinite;
|
||
|
}
|
||
|
|
||
|
.animated.repeat-1 {
|
||
|
animation-iteration-count: var(--animate-repeat);
|
||
|
}
|
||
|
|
||
|
.animated.repeat-2 {
|
||
|
animation-iteration-count: calc(var(--animate-repeat) * 2);
|
||
|
}
|
||
|
|
||
|
.animated.repeat-3 {
|
||
|
animation-iteration-count: calc(var(--animate-repeat) * 3);
|
||
|
}
|
||
|
|
||
|
.animated.delay-1s {
|
||
|
animation-delay: var(--animate-delay);
|
||
|
}
|
||
|
|
||
|
.animated.delay-2s {
|
||
|
animation-delay: calc(var(--animate-delay) * 2);
|
||
|
}
|
||
|
|
||
|
.animated.delay-3s {
|
||
|
animation-delay: calc(var(--animate-delay) * 3);
|
||
|
}
|
||
|
|
||
|
.animated.delay-4s {
|
||
|
animation-delay: calc(var(--animate-delay) * 4);
|
||
|
}
|
||
|
|
||
|
.animated.delay-5s {
|
||
|
animation-delay: calc(var(--animate-delay) * 5);
|
||
|
}
|
||
|
|
||
|
.animated.faster {
|
||
|
animation-duration: calc(var(--animate-duration) / 2);
|
||
|
}
|
||
|
|
||
|
.animated.fast {
|
||
|
animation-duration: calc(var(--animate-duration) * 0.8);
|
||
|
}
|
||
|
|
||
|
.animated.slow {
|
||
|
animation-duration: calc(var(--animate-duration) * 2);
|
||
|
}
|
||
|
|
||
|
.animated.slower {
|
||
|
animation-duration: calc(var(--animate-duration) * 3);
|
||
|
}
|
||
|
|
||
|
@media print, (prefers-reduced-motion: reduce) {
|
||
|
.animated {
|
||
|
animation-duration: 1ms !important;
|
||
|
transition-duration: 1ms !important;
|
||
|
animation-iteration-count: 1 !important;
|
||
|
}
|
||
|
|
||
|
.animated[class*='Out'] {
|
||
|
opacity: 0;
|
||
|
}
|
||
|
}
|