Files
gridpilot.gg/apps/website/components/achievements/MilestoneItem.tsx
2026-01-18 13:26:35 +01:00

22 lines
678 B
TypeScript

import React from 'react';
import { Box } from '@/ui/Box';
import { Text } from '@/ui/Text';
interface MilestoneItemProps {
label: string;
value: string;
icon: string;
}
export function MilestoneItem({ label, value, icon }: MilestoneItemProps) {
return (
<Box display="flex" alignItems="center" justifyContent="between" p={3} rounded="md" bg="bg-deep-graphite" border borderColor="border-charcoal-outline">
<Box display="flex" alignItems="center" gap={3}>
<Text size="xl">{icon}</Text>
<Text size="sm" color="text-gray-400">{label}</Text>
</Box>
<Text size="sm" weight="medium" color="text-white">{value}</Text>
</Box>
);
}