react-price-animation/dist/style.css

A component for animating numbers and prices in React.

@keyframes prefix_kc7kd34{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}4%{transform:translate3d(0,-300%,0);opacity:1}6%{transform:translate3d(0,-400%,0);opacity:1}8%{transform:translate3d(0,-500%,0);opacity:1}9%{transform:translate3d(0,-600%,0);opacity:1}10%{transform:translate3d(0,-700%,0);opacity:1}20%{transform:translate3d(0,-800%,0);opacity:1}50%{transform:translate3d(0,-900%,0);opacity:1}to{transform:translate3d(0,-1000%,0);opacity:1}}@keyframes prefix_kc7kd35{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}3%{transform:translate3d(0,-200%,0);opacity:1}5%{transform:translate3d(0,-300%,0);opacity:1}7%{transform:translate3d(0,-400%,0);opacity:1}9%{transform:translate3d(0,-500%,0);opacity:1}11%{transform:translate3d(0,-600%,0);opacity:1}13%{transform:translate3d(0,-700%,0);opacity:1}15%{transform:translate3d(0,-800%,0);opacity:1}25%{transform:translate3d(0,-900%,0);opacity:1}50%{transform:translate3d(0,-1000%,0);opacity:1}to{transform:translate3d(0,-1100%,0);opacity:1}}@keyframes prefix_kc7kd36{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}5%{transform:translate3d(0,-400%,0);opacity:1}7%{transform:translate3d(0,-500%,0);opacity:1}9%{transform:translate3d(0,-600%,0);opacity:1}11%{transform:translate3d(0,-700%,0);opacity:1}13%{transform:translate3d(0,-800%,0);opacity:1}15%{transform:translate3d(0,-900%,0);opacity:1}25%{transform:translate3d(0,-1000%,0);opacity:1}50%{transform:translate3d(0,-1100%,0);opacity:1}to{transform:translate3d(0,-1200%,0);opacity:1}}@keyframes prefix_kc7kd37{0%{transform:translateZ(0);opacity:1}2%{transform:translate3d(0,-100%,0);opacity:1}5%{transform:translate3d(0,-200%,0);opacity:1}8%{transform:translate3d(0,-300%,0);opacity:1}11%{transform:translate3d(0,-400%,0);opacity:1}14%{transform:translate3d(0,-500%,0);opacity:1}17%{transform:translate3d(0,-600%,0);opacity:1}20%{transform:translate3d(0,-700%,0);opacity:1}23%{transform:translate3d(0,-800%,0);opacity:1}26%{transform:translate3d(0,-900%,0);opacity:1}29%{transform:translate3d(0,-1000%,0);opacity:1}32%{transform:translate3d(0,-1100%,0);opacity:1}55%{transform:translate3d(0,-1200%,0);opacity:1}to{transform:translate3d(0,-1300%,0);opacity:1}}@keyframes prefix_kc7kd38{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}4%{transform:translate3d(0,-300%,0);opacity:1}6%{transform:translate3d(0,-400%,0);opacity:1}8%{transform:translate3d(0,-500%,0);opacity:1}10%{transform:translate3d(0,-600%,0);opacity:1}12%{transform:translate3d(0,-700%,0);opacity:1}14%{transform:translate3d(0,-800%,0);opacity:1}16%{transform:translate3d(0,-900%,0);opacity:1}18%{transform:translate3d(0,-1000%,0);opacity:1}20%{transform:translate3d(0,-1100%,0);opacity:1}30%{transform:translate3d(0,-1200%,0);opacity:1}60%{transform:translate3d(0,-1300%,0);opacity:1}to{transform:translate3d(0,-1400%,0);opacity:1}}@keyframes prefix_kc7kd39{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}5%{transform:translate3d(0,-400%,0);opacity:1}6%{transform:translate3d(0,-500%,0);opacity:1}8%{transform:translate3d(0,-600%,0);opacity:1}10%{transform:translate3d(0,-700%,0);opacity:1}12%{transform:translate3d(0,-800%,0);opacity:1}14%{transform:translate3d(0,-900%,0);opacity:1}16%{transform:translate3d(0,-1000%,0);opacity:1}18%{transform:translate3d(0,-1100%,0);opacity:1}20%{transform:translate3d(0,-1200%,0);opacity:1}30%{transform:translate3d(0,-1300%,0);opacity:1}60%{transform:translate3d(0,-1400%,0);opacity:1}to{transform:translate3d(0,-1500%,0);opacity:1}}@keyframes prefix_kc7kd3a{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}4%{transform:translate3d(0,-400%,0);opacity:1}5%{transform:translate3d(0,-500%,0);opacity:1}6%{transform:translate3d(0,-600%,0);opacity:1}8%{transform:translate3d(0,-700%,0);opacity:1}10%{transform:translate3d(0,-800%,0);opacity:1}12%{transform:translate3d(0,-900%,0);opacity:1}14%{transform:translate3d(0,-1000%,0);opacity:1}16%{transform:translate3d(0,-1100%,0);opacity:1}18%{transform:translate3d(0,-1200%,0);opacity:1}20%{transform:translate3d(0,-1300%,0);opacity:1}30%{transform:translate3d(0,-1400%,0);opacity:1}60%{transform:translate3d(0,-1500%,0);opacity:1}to{transform:translate3d(0,-1600%,0);opacity:1}}@keyframes prefix_kc7kd3b{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}4%{transform:translate3d(0,-400%,0);opacity:1}6%{transform:translate3d(0,-500%,0);opacity:1}7%{transform:translate3d(0,-600%,0);opacity:1}8%{transform:translate3d(0,-700%,0);opacity:1}9%{transform:translate3d(0,-800%,0);opacity:1}10%{transform:translate3d(0,-900%,0);opacity:1}12%{transform:translate3d(0,-1000%,0);opacity:1}14%{transform:translate3d(0,-1100%,0);opacity:1}16%{transform:translate3d(0,-1200%,0);opacity:1}18%{transform:translate3d(0,-1300%,0);opacity:1}20%{transform:translate3d(0,-1400%,0);opacity:1}30%{transform:translate3d(0,-1500%,0);opacity:1}60%{transform:translate3d(0,-1600%,0);opacity:1}to{transform:translate3d(0,-1700%,0);opacity:1}}@keyframes prefix_kc7kd3c{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}4%{transform:translate3d(0,-400%,0);opacity:1}6%{transform:translate3d(0,-500%,0);opacity:1}7%{transform:translate3d(0,-600%,0);opacity:1}9%{transform:translate3d(0,-700%,0);opacity:1}10%{transform:translate3d(0,-800%,0);opacity:1}12%{transform:translate3d(0,-900%,0);opacity:1}13%{transform:translate3d(0,-1000%,0);opacity:1}15%{transform:translate3d(0,-1100%,0);opacity:1}16%{transform:translate3d(0,-1200%,0);opacity:1}17%{transform:translate3d(0,-1300%,0);opacity:1}18%{transform:translate3d(0,-1400%,0);opacity:1}20%{transform:translate3d(0,-1500%,0);opacity:1}30%{transform:translate3d(0,-1600%,0);opacity:1}60%{transform:translate3d(0,-1700%,0);opacity:1}to{transform:translate3d(0,-1800%,0);opacity:1}}@keyframes prefix_kc7kd3d{0%{transform:translateZ(0);opacity:1}1%{transform:translate3d(0,-100%,0);opacity:1}2%{transform:translate3d(0,-200%,0);opacity:1}3%{transform:translate3d(0,-300%,0);opacity:1}4%{transform:translate3d(0,-400%,0);opacity:1}5%{transform:translate3d(0,-500%,0);opacity:1}6%{transform:translate3d(0,-600%,0);opacity:1}8%{transform:translate3d(0,-700%,0);opacity:1}9%{transform:translate3d(0,-800%,0);opacity:1}10%{transform:translate3d(0,-900%,0);opacity:1}11%{transform:translate3d(0,-1000%,0);opacity:1}13%{transform:translate3d(0,-1100%,0);opacity:1}14%{transform:translate3d(0,-1200%,0);opacity:1}15%{transform:translate3d(0,-1300%,0);opacity:1}17%{transform:translate3d(0,-1400%,0);opacity:1}18%{transform:translate3d(0,-1500%,0);opacity:1}20%{transform:translate3d(0,-1600%,0);opacity:1}30%{transform:translate3d(0,-1700%,0);opacity:1}60%{transform:translate3d(0,-1800%,0);opacity:1}to{transform:translate3d(0,-1900%,0);opacity:1}}@keyframes prefix_kc7kd3e{0%{transform:translate3d(0,var(--prefix_kc7kd33),0);opacity:0}to{transform:translate3d(0,var(--prefix_kc7kd32),0);opacity:1}}@keyframes prefix_kc7kd3f{to{transform:translate3d(0,var(--prefix_kc7kd32),0);opacity:1}}.prefix_kc7kd3g{display:inline-block;vertical-align:middle;height:var(--prefix_kc7kd30);line-height:var(--prefix_kc7kd30);overflow:hidden}.prefix_kc7kd3h{display:block;text-align:center}.prefix_kc7kd3i{animation:prefix_kc7kd34 2s ease-out forwards}.prefix_kc7kd3j{animation:prefix_kc7kd35 2s ease-out forwards}.prefix_kc7kd3k{animation:prefix_kc7kd36 2s ease-out forwards}.prefix_kc7kd3l{animation:prefix_kc7kd37 2s ease-out forwards}.prefix_kc7kd3m{animation:prefix_kc7kd38 2s ease-out forwards}.prefix_kc7kd3n{animation:prefix_kc7kd39 2s ease-out forwards}.prefix_kc7kd3o{animation:prefix_kc7kd3a 2s ease-out forwards}.prefix_kc7kd3p{animation:prefix_kc7kd3b 2s ease-out forwards}.prefix_kc7kd3q{animation:prefix_kc7kd3c 2s ease-out forwards}.prefix_kc7kd3r{animation:prefix_kc7kd3d 2s ease-out forwards}.prefix_kc7kd3s{opacity:0;animation-delay:var(--prefix_kc7kd31)}.prefix_kc7kd3t{animation:prefix_kc7kd3e .5s ease-out forwards}.prefix_kc7kd3u{animation:prefix_kc7kd3f forwards}