website refactor

This commit is contained in:
2026-01-20 12:16:58 +01:00
parent 3556db494f
commit a0d8d47e49
8 changed files with 276 additions and 187 deletions

View File

@@ -2,11 +2,12 @@
import { Heading } from '@/ui/Heading';
import { Text } from '@/ui/Text';
import { Group } from '@/ui/Group';
import { Box } from '@/ui/Box';
import { Table, TableHead, TableBody, TableRow, TableHeaderCell } from '@/ui/Table';
import { TrendingUp } from 'lucide-react';
import { Card } from '@/ui/Card';
import { Icon } from '@/ui/Icon';
import { Surface } from '@/ui/Surface';
import { Stack } from '@/ui/Stack';
import React from 'react';
interface DriverTableProps {
@@ -15,31 +16,31 @@ interface DriverTableProps {
export function DriverTable({ children }: DriverTableProps) {
return (
<Group direction="column" gap={4} fullWidth>
<Group direction="row" align="center" gap={3}>
<Card variant="dark">
<Stack direction="col" gap="md">
<Box display="flex" alignItems="center" gap={3}>
<Surface variant="precision" rounded="md" padding="sm">
<Icon icon={TrendingUp} size={5} intent="primary" />
</Card>
<Group direction="column">
<Heading level={2}>Driver Rankings</Heading>
<Text size="xs" variant="low">Top performers by skill rating</Text>
</Group>
</Group>
</Surface>
<Stack direction="col" gap="none">
<Heading level={2} weight="bold">Driver Rankings</Heading>
<Text size="xs" variant="low">Performance metrics based on sanctioned race results</Text>
</Stack>
</Box>
<Table>
<TableHead>
<TableRow>
<TableHeaderCell textAlign="center" w="60px">#</TableHeaderCell>
<TableHeaderCell>Driver</TableHeaderCell>
<TableHeaderCell w="150px">Nationality</TableHeaderCell>
<TableHeaderCell textAlign="right" w="100px">Rating</TableHeaderCell>
<TableHeaderCell textAlign="right" w="80px">Wins</TableHeaderCell>
<TableHeaderCell textAlign="center" w="60px">Rank</TableHeaderCell>
<TableHeaderCell>Competitor</TableHeaderCell>
<TableHeaderCell w="180px">Nationality</TableHeaderCell>
<TableHeaderCell textAlign="right" w="120px">Skill Rating</TableHeaderCell>
<TableHeaderCell textAlign="right" w="100px">Victories</TableHeaderCell>
</TableRow>
</TableHead>
<TableBody>
{children}
</TableBody>
</Table>
</Group>
</Stack>
);
}