1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- .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;
- }
- }
|