website refactor

apps/website/components/leagues/LeagueNavTabs.tsx

@@ -1,7 +1,6 @@
 'use client';
 
 import React from 'react';
-import { Box } from '@/ui/Box';
 import { Stack } from '@/ui/Stack';
 import { Link } from '@/ui/Link';
 
@@ -18,7 +17,7 @@ interface LeagueNavTabsProps {
 
 export function LeagueNavTabs({ tabs, currentPathname }: LeagueNavTabsProps) {
   return (
-    <Box as="nav" borderBottom borderColor="zinc-800" mb={6}>
+    <Stack as="nav" borderBottom borderColor="zinc-800" mb={6}>
       <Stack as="ul" direction="row" gap={8} overflow="auto" hideScrollbar>
         {tabs.map((tab) => {
           const isActive = tab.exact 
@@ -26,7 +25,7 @@ export function LeagueNavTabs({ tabs, currentPathname }: LeagueNavTabsProps) {
             : currentPathname.startsWith(tab.href);
 
           return (
-            <Box as="li" key={tab.href} position="relative">
+            <Stack as="li" key={tab.href} position="relative">
               <Link
                 href={tab.href}
                 variant="ghost"
@@ -41,7 +40,7 @@ export function LeagueNavTabs({ tabs, currentPathname }: LeagueNavTabsProps) {
                 {tab.label}
               </Link>
               {isActive && (
-                <Box 
+                <Stack 
                   position="absolute" 
                   bottom="0" 
                   left="0" 
@@ -50,10 +49,10 @@ export function LeagueNavTabs({ tabs, currentPathname }: LeagueNavTabsProps) {
                   bg="bg-blue-500" 
                 />
               )}
-            </Box>
+            </Stack>
           );
         })}
       </Stack>
-    </Box>
+    </Stack>
   );
 }