{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "marquee",
  "type": "registry:ui",
  "title": "Marquee",
  "files": [
    {
      "path": "src/components/ui/marquee.tsx",
      "content": "export default function Marquee({ items }: { items: string[] }) {\r\n  return (\r\n    <div className=\"relative flex w-full overflow-x-hidden border-b-2 border-t-2 border-border bg-secondary-background text-foreground font-base\">\r\n      <div className=\"animate-marquee whitespace-nowrap py-12\">\r\n        {items.map((item) => {\r\n          return (\r\n            <span key={item} className=\"mx-4 text-4xl\">\r\n              {item}\r\n            </span>\r\n          )\r\n        })}\r\n      </div>\r\n\r\n      <div className=\"absolute top-0 animate-marquee2 whitespace-nowrap py-12\">\r\n        {items.map((item) => {\r\n          return (\r\n            <span key={item} className=\"mx-4 text-4xl\">\r\n              {item}\r\n            </span>\r\n          )\r\n        })}\r\n      </div>\r\n\r\n      {/* must have both of these in order to work */}\r\n    </div>\r\n  )\r\n}\r\n",
      "type": "registry:ui"
    }
  ],
  "docs": "Make sure there is enough content in `items` so it loops perfectly. Visit https://jackwhiting.co.uk/posts/creating-a-marquee-with-tailwind to learn more."
}