website refactor

apps/website/components/teams/TeamRosterItem.tsx

@@ -1,5 +1,4 @@
 import React, { ReactNode } from 'react';
-import { Box } from '@/ui/Box';
 import { Stack } from '@/ui/Stack';
 import { Text } from '@/ui/Text';
 import { DriverIdentity } from '@/components/drivers/DriverIdentity';
@@ -25,7 +24,7 @@ export function TeamRosterItem({
   actions,
 }: TeamRosterItemProps) {
   return (
-    <Box
+    <Stack
       bg="bg-iron-gray/50"
       rounded="lg"
       border={true}
@@ -47,17 +46,17 @@ export function TeamRosterItem({
 
         {rating !== null && (
           <Stack direction="row" align="center" gap={6}>
-            <Box display="flex" flexDirection="col" alignItems="center">
+            <Stack display="flex" flexDirection="col" alignItems="center">
               <Text size="lg" weight="bold" color="text-primary-blue" block>
                 {rating}
               </Text>
               <Text size="xs" color="text-gray-400">Rating</Text>
-            </Box>
+            </Stack>
             {overallRank !== null && (
-              <Box display="flex" flexDirection="col" alignItems="center">
+              <Stack display="flex" flexDirection="col" alignItems="center">
                 <Text size="sm" color="text-gray-300" block>#{overallRank}</Text>
                 <Text size="xs" color="text-gray-500">Rank</Text>
-              </Box>
+              </Stack>
             )}
           </Stack>
         )}
@@ -68,6 +67,6 @@ export function TeamRosterItem({
           </Stack>
         )}
       </Stack>
-    </Box>
+    </Stack>
   );
 }