Running Area

import { RunningArea } from "@/ui/running-area";
import { Typography } from "@/ui/typography";

export function TypographyDemo() {
  return (
    <div className="w-full space-y-12 flex flex-col items-center justify-center">
      <Typography el="h6" prose="h3">Sponsor</Typography>
      <RunningArea classNames={{ container: "w-full", content: "space-x-2" }}>
        {[...Array(5)].map((_, index) => (
          <span key={index} className="select-none flex items-center justify-center border font-extrabold text-h1 py-4 px-8 rounded-xl w-52">
            {index + 1}
          </span>
        ))}
      </RunningArea>
    </div>
  );
}