website refactor

apps/website/components/profile/ProfileStatGrid.tsx

@@ -0,0 +1,34 @@
+import { Box } from '../../ui/primitives/Box';
+import { Grid } from '../../ui/primitives/Grid';
+import { Text } from '../../ui/Text';
+
+interface Stat {
+  label: string;
+  value: string | number;
+  color?: string;
+}
+
+interface ProfileStatGridProps {
+  stats: Stat[];
+}
+
+export function ProfileStatGrid({ stats }: ProfileStatGridProps) {
+  return (
+    <Grid cols={2} mdCols={4} gap={4}>
+      {stats.map((stat, idx) => (
+        <Box 
+          key={idx} 
+          p={4} 
+          bg="bg-[#0f1115]" 
+          rounded="xl" 
+          border 
+          borderColor="border-[#262626]" 
+          textAlign="center"
+        >
+          <Text size="3xl" weight="bold" color={stat.color} block mb={1}>{stat.value}</Text>
+          <Text size="xs" color="text-gray-500" uppercase letterSpacing="0.05em">{stat.label}</Text>
+        </Box>
+      ))}
+    </Grid>
+  );
+}