_base.css 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. .animated {
  2. animation-duration: var(--animate-duration);
  3. animation-fill-mode: both;
  4. }
  5. .animated.infinite {
  6. animation-iteration-count: infinite;
  7. }
  8. .animated.repeat-1 {
  9. animation-iteration-count: var(--animate-repeat);
  10. }
  11. .animated.repeat-2 {
  12. animation-iteration-count: calc(var(--animate-repeat) * 2);
  13. }
  14. .animated.repeat-3 {
  15. animation-iteration-count: calc(var(--animate-repeat) * 3);
  16. }
  17. .animated.delay-1s {
  18. animation-delay: var(--animate-delay);
  19. }
  20. .animated.delay-2s {
  21. animation-delay: calc(var(--animate-delay) * 2);
  22. }
  23. .animated.delay-3s {
  24. animation-delay: calc(var(--animate-delay) * 3);
  25. }
  26. .animated.delay-4s {
  27. animation-delay: calc(var(--animate-delay) * 4);
  28. }
  29. .animated.delay-5s {
  30. animation-delay: calc(var(--animate-delay) * 5);
  31. }
  32. .animated.faster {
  33. animation-duration: calc(var(--animate-duration) / 2);
  34. }
  35. .animated.fast {
  36. animation-duration: calc(var(--animate-duration) * 0.8);
  37. }
  38. .animated.slow {
  39. animation-duration: calc(var(--animate-duration) * 2);
  40. }
  41. .animated.slower {
  42. animation-duration: calc(var(--animate-duration) * 3);
  43. }
  44. @media print, (prefers-reduced-motion: reduce) {
  45. .animated {
  46. animation-duration: 1ms !important;
  47. transition-duration: 1ms !important;
  48. animation-iteration-count: 1 !important;
  49. }
  50. .animated[class*='Out'] {
  51. opacity: 0;
  52. }
  53. }