react-fast-marquee-shadow-dom/dist/marquee.css.map

A lightweight React component that utilizes the power of CSS animations to create silky smooth marquees.

{"version":3,"sources":["Marquee.scss"],"names":[],"mappings":"AAAA,uBAEE,YAAa,CACb,kBAAmB,CAFnB,iBAAkB,CAGlB,iBAAkB,CAElB,0BAA2B,CAD3B,kBAEF,CACA,iCACE,0CACF,CACA,kCACE,0CACF,CAEA,aAGE,WAAY,CAFZ,iBAAkB,CAClB,UAEF,CACA,uCACE,4EAAoF,CACpF,UAAW,CACX,WAAY,CAIZ,mBAAoB,CAHpB,iBAAkB,CAIlB,iBAAkB,CAHlB,2BAA4B,CAC5B,SAGF,CACA,mBACE,OAAQ,CACR,KAAM,CACN,wBACF,CACA,oBACE,MAAO,CACP,KACF,CAEA,aAME,kBAAmB,CACnB,2EAA4E,CAE5E,4BAA6B,CAC7B,oCAAqC,CAFrC,gCAAiC,CAJjC,YAAa,CAHb,aAAc,CAId,kBAAmB,CAHnB,0BAA2B,CAC3B,SAQF,CACA,kBACE,GACE,uBACF,CACA,GACE,2BACF,CACF,CAEA,6BAKE,kBAAmB,CAHnB,YAAa,CADb,aAAc,CAGd,kBAAmB,CADnB,cAGF,CAEA,WACE,0BACF","file":"marquee.css","sourcesContent":[".rfm-marquee-container {\n  overflow-x: hidden;\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  width: var(--width);\n  transform: var(--transform);\n}\n.rfm-marquee-container:hover div {\n  animation-play-state: var(--pause-on-hover);\n}\n.rfm-marquee-container:active div {\n  animation-play-state: var(--pause-on-click);\n}\n\n.rfm-overlay {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n}\n.rfm-overlay::before, .rfm-overlay::after {\n  background: linear-gradient(to right, var(--gradient-color), rgba(255, 255, 255, 0));\n  content: \"\";\n  height: 100%;\n  position: absolute;\n  width: var(--gradient-width);\n  z-index: 2;\n  pointer-events: none;\n  touch-action: none;\n}\n.rfm-overlay::after {\n  right: 0;\n  top: 0;\n  transform: rotateZ(180deg);\n}\n.rfm-overlay::before {\n  left: 0;\n  top: 0;\n}\n\n.rfm-marquee {\n  flex: 0 0 auto;\n  min-width: var(--min-width);\n  z-index: 1;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  animation: scroll var(--duration) linear var(--delay) var(--iteration-count);\n  animation-play-state: var(--play);\n  animation-delay: var(--delay);\n  animation-direction: var(--direction);\n}\n@keyframes scroll {\n  0% {\n    transform: translateX(0%);\n  }\n  100% {\n    transform: translateX(-100%);\n  }\n}\n\n.rfm-initial-child-container {\n  flex: 0 0 auto;\n  display: flex;\n  min-width: auto;\n  flex-direction: row;\n  align-items: center;\n}\n\n.rfm-child {\n  transform: var(--transform);\n}"]}