website refactor

apps/website/components/app/AppFooter.tsx

@@ -24,7 +24,7 @@ export function AppFooter({ children }: AppFooterProps) {
       variant="muted" 
       paddingY={8} 
       marginTop="auto"
-      style={{ borderTop: '1px solid var(--ui-color-border-default)' }}
+      borderTop={true}
     >
       <Container size="xl">
         {children ? (

apps/website/components/leagues/CreateLeagueWizardLayout.tsx

@@ -1,7 +1,9 @@
 'use client';
 
 import { ReactNode } from 'react';
-import { SharedBox, SharedStack, SharedContainer } from '@/components/shared/UIComponents';
+import { Box } from '@/ui/Box';
+import { Stack } from '@/ui/Stack';
+import { Container } from '@/ui/Container';
 
 interface CreateLeagueWizardLayoutProps {
   children: ReactNode;
@@ -13,12 +15,12 @@ interface CreateLeagueWizardLayoutProps {
 
 export function CreateLeagueWizardLayout({ children, header, progress, navigation, footer }: CreateLeagueWizardLayoutProps) {
   return (
-    <SharedBox as="main" maxWidth="4xl" mx="auto" pb={8}>
+    <Box as="main" maxWidth="4xl" mx="auto" pb={8}>
       {header}
       {progress}
       {children}
       {navigation}
       {footer}
-    </SharedBox>
+    </Box>
   );
 }

apps/website/components/shared/SharedEmptyState.tsx

@@ -1,26 +0,0 @@
-'use client';
-
-import { LucideIcon } from 'lucide-react';
-import { EmptyState } from '@/ui/EmptyState';
-
-interface SharedEmptyStateProps {
-  icon: LucideIcon;
-  title: string;
-  description?: string;
-  action?: {
-    label: string;
-    onClick: () => void;
-    variant?: 'primary' | 'secondary' | 'ghost' | 'danger' | 'race-final' | 'discord';
-  };
-}
-
-export function SharedEmptyState({ icon, title, description, action }: SharedEmptyStateProps) {
-  return (
-    <EmptyState
-      icon={icon}
-      title={title}
-      description={description}
-      action={action}
-    />
-  );
-}

apps/website/components/shared/UIComponents.tsx

@@ -1,44 +0,0 @@
-import { Pagination } from '@/ui/Pagination';
-import { Text } from '@/ui/Text';
-import { Box } from '@/ui/Box';
-import { Stack } from '@/ui/Stack';
-import { Container } from '@/ui/Container';
-import { ConfirmDialog } from '@/components/shared/ConfirmDialog';
-import { Button } from '@/ui/Button';
-import { Icon } from '@/ui/Icon';
-import { Card } from '@/ui/Card';
-import { Heading } from '@/ui/Heading';
-import { Grid } from '@/ui/Grid';
-import { GridItem } from '@/ui/GridItem';
-import { Surface } from '@/ui/Surface';
-import { Input } from '@/ui/Input';
-import { Link } from '@/ui/Link';
-import { Skeleton } from '@/ui/Skeleton';
-import { LoadingSpinner } from '@/ui/LoadingSpinner';
-import { Badge } from '@/ui/Badge';
-
-import { ProgressLine } from '@/components/shared/ProgressLine';
-import { SharedEmptyState } from './SharedEmptyState';
-
-export { 
-  Pagination as SharedPagination,
-  Text as SharedText,
-  Box as SharedBox,
-  Stack as SharedStack,
-  Container as SharedContainer,
-  ConfirmDialog as SharedConfirmDialog,
-  Button as SharedButton,
-  Icon as SharedIcon,
-  Card as SharedCard,
-  Heading as SharedHeading,
-  Grid as SharedGrid,
-  GridItem as SharedGridItem,
-  Surface as SharedSurface,
-  Input as SharedInput,
-  Link as SharedLink,
-  Skeleton as SharedSkeleton,
-  LoadingSpinner as SharedLoadingSpinner,
-  Badge as SharedBadge,
-  ProgressLine as SharedProgressLine,
-  SharedEmptyState
-};