Frontend/src/app/(pages)/page.tsx

import Link from "next/link";

type Button = {
  title: string;
  url: string;
};

const buttons: Button[] = [
  { title: "Get Started", url: "/player/Notch" },
  { title: "Documentation", url: "https://api.mcutils.xyz/swagger-ui.html" },
];

export default function Home(): JSX.Element {
  return (
    <div className="text-center flex flex-col justify-center">
      <h1 className="text-4xl mb-2">Minecraft Utilities</h1>
      <div className="text-lg">
        <p>Minecraft Utilities offers you many endpoints to get information about a minecraft server or a player.</p>
        <p>
          You can use this information on your minecraft server or website. We offer you a simple and easy to use API.
        </p>
      </div>

      <div className="mt-6 flex flex-row gap-2 justify-center">
        {buttons.map((button, index) => {
          return (
            <Link
              key={index}
              href={button.url}
              target="_blank"
              className="w-fit p-2 rounded-lg hover:text-primary transition-all cursor-pointer bg-secondary"
            >
              <p>{button.title}</p>
            </Link>
          );
        })}
      </div>
    </div>
  );
}