website refactor

This commit is contained in:
2026-01-18 16:18:18 +01:00
parent 0b301feb61
commit 13567d51af
329 changed files with 4701 additions and 4750 deletions

View File

@@ -5,7 +5,6 @@ import { ProtestViewModel } from "@/lib/view-models/ProtestViewModel";
import { RaceViewModel } from "@/lib/view-models/RaceViewModel";
import { DriverViewModel } from "@/lib/view-models/DriverViewModel";
import { Card } from "@/ui/Card";
import { Box } from "@/ui/Box";
import { Stack } from "@/ui/Stack";
import { Text } from "@/ui/Text";
import { Heading } from "@/ui/Heading";
@@ -45,15 +44,15 @@ export function PenaltyHistoryList({
return (
<Stack gap={4}>
{filteredProtests.length === 0 ? (
<Card py={12} textAlign="center">
<Stack alignItems="center" gap={4}>
<Card py={12} className="text-center">
<Stack align="center" gap={4}>
<Icon icon={AlertCircle} size={12} color="text-gray-400" opacity={0.5} />
<Box>
<Stack>
<Text weight="medium" size="lg" color="text-gray-400" block>No Resolved Protests</Text>
<Text size="sm" color="text-gray-500" mt={1} block>
No protests have been resolved in this league
</Text>
</Box>
</Stack>
</Stack>
</Card>
) : (
@@ -68,45 +67,42 @@ export function PenaltyHistoryList({
return (
<Card key={protest.id} p={4}>
<Box display="flex" alignItems="start" gap={4}>
<Box
<Stack direction="row" align="start" gap={4}>
<Stack
w="10"
h="10"
rounded="full"
display="flex"
alignItems="center"
justifyContent="center"
align="center"
justify="center"
flexShrink={0}
bg={statusColors.bg}
color={statusColors.text}
>
<Icon icon={Flag} size={5} />
</Box>
<Box flex={1}>
</Stack>
<Stack flex={1}>
<Stack gap={2}>
<Box display="flex" alignItems="start" justifyContent="between" gap={4}>
<Box>
<Stack direction="row" align="start" justify="between" gap={4}>
<Stack>
<Heading level={3}>
Protest #{protest.id.substring(0, 8)}
</Heading>
<Text size="sm" color="text-gray-400" block>
{resolvedDate ? `Resolved ${new Date(resolvedDate).toLocaleDateString()}` : 'Resolved'}
</Text>
</Box>
<Box
</Stack>
<Stack
px={3}
py={1}
rounded="full"
bg={statusColors.bg}
color={statusColors.text}
fontSize="12px"
weight="medium"
flexShrink={0}
className="text-[12px] font-medium flex-shrink-0"
>
{protest.status.toUpperCase()}
</Box>
</Box>
<Box>
</Stack>
</Stack>
<Stack>
<Text size="sm" color="text-gray-400" block>
<Text weight="medium" color="text-white">{protester?.name || 'Unknown'}</Text> vs <Text weight="medium" color="text-white">{accused?.name || 'Unknown'}</Text>
</Text>
@@ -115,20 +111,20 @@ export function PenaltyHistoryList({
{race.track} ({race.car}) - Lap {incident.lap}
</Text>
)}
</Box>
</Stack>
{incident && (
<Text size="sm" color="text-gray-300" block>{incident.description}</Text>
)}
{protest.decisionNotes && (
<Box mt={2} p={2} rounded="md" bg="bg-iron-gray/30" border borderColor="border-charcoal-outline/50">
<Stack mt={2} p={2} rounded="md" bg="bg-iron-gray/30" border borderColor="border-charcoal-outline/50">
<Text size="xs" color="text-gray-400" block>
<Text weight="medium">Steward Notes:</Text> {protest.decisionNotes}
</Text>
</Box>
</Stack>
)}
</Stack>
</Box>
</Box>
</Stack>
</Stack>
</Card>
);
})}
@@ -136,4 +132,4 @@ export function PenaltyHistoryList({
)}
</Stack>
);
}
}