website refactor

apps/website/components/leagues/LeagueTabs.tsx

@@ -0,0 +1,36 @@
+'use client';
+
+import React from 'react';
+import { Box } from '@/ui/Box';
+import { Stack } from '@/ui/Stack';
+import { Link } from '@/ui/Link';
+
+interface Tab {
+  label: string;
+  href: string;
+  exact?: boolean;
+}
+
+interface LeagueTabsProps {
+  tabs: Tab[];
+}
+
+export function LeagueTabs({ tabs }: LeagueTabsProps) {
+  return (
+    <Box style={{ borderBottom: '1px solid #262626' }}>
+      <Stack direction="row" gap={6} style={{ overflowX: 'auto' }}>
+        {tabs.map((tab) => (
+          <Link
+            key={tab.href}
+            href={tab.href}
+            variant="ghost"
+          >
+            <Box pb={3} px={1}>
+              <span style={{ fontWeight: 500, whiteSpace: 'nowrap' }}>{tab.label}</span>
+            </Box>
+          </Link>
+        ))}
+      </Stack>
+    </Box>
+  );
+}