mmintel/gridpilot.gg
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

website refactor

Browse Source
This commit is contained in:
Marc Mintel
2026-01-18 16:18:18 +01:00
parent 0b301feb61
commit 13567d51af
329 changed files with 4701 additions and 4750 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
apps/website/components/races/RaceListItem.tsx
View File

@@ -2,11 +2,10 @@
import { ArrowRight, Car, ChevronRight, LucideIcon, Trophy, Zap } from 'lucide-react';
import { Badge } from '@/ui/Badge';
import { Box } from '@/ui/Box';
import { Stack } from '@/ui/Stack';
import { Heading } from '@/ui/Heading';
import { Icon } from '@/ui/Icon';
import { Link } from '@/ui/Link';
import { Stack } from '@/ui/Stack';
import { Text } from '@/ui/Text';
interface RaceListItemProps {
@@ -45,7 +44,7 @@ export function RaceListItem({
const StatusIcon = statusConfig.icon;
return (
<Box
<Stack
onClick={onClick}
position="relative"
overflow="hidden"
@@ -61,7 +60,7 @@ export function RaceListItem({
>
{/* Live indicator */}
{status === 'running' && (
<Box
<Stack
position="absolute"
top="0"
left="0"
@@ -74,7 +73,7 @@ export function RaceListItem({
<Stack direction="row" align="center" gap={4}>
{/* Time/Date Column */}
<Box flexShrink={0} textAlign="center" width="16">
<Stack flexShrink={0} textAlign="center" width="16">
{dateLabel && (
<Text size="xs" color="text-gray-500" block uppercase>
{dateLabel}
@@ -86,15 +85,15 @@ export function RaceListItem({
<Text size="xs" color={status === 'running' ? 'text-success-green' : 'text-gray-400'} block>
{status === 'running' ? 'LIVE' : relativeTimeLabel || timeLabel}
</Text>
</Box>
</Stack>
{/* Divider */}
<Box w="px" h="10" alignSelf="stretch" bg="border-outline-steel" />
<Stack w="px" h="10" alignSelf="stretch" bg="border-outline-steel" />
{/* Main Content */}
<Box flexGrow={1} minWidth="0">
<Stack flexGrow={1} minWidth="0">
<Stack direction="row" align="start" justify="between" gap={4}>
<Box minWidth="0">
<Stack minWidth="0">
<Heading level={3} truncate groupHoverTextColor="text-primary-accent" transition>
{track}
</Heading>
@@ -110,7 +109,7 @@ export function RaceListItem({
</Stack>
)}
</Stack>
</Box>
</Stack>
{/* Status Badge */}
<Badge variant={statusConfig.variant}>
@@ -121,7 +120,7 @@ export function RaceListItem({
{/* League Link */}
{leagueName && leagueHref && (
<Box mt={3} pt={3} borderTop borderColor="border-outline-steel" borderOpacity={0.3}>
<Stack mt={3} pt={3} borderTop borderColor="border-outline-steel" borderOpacity={0.3}>
<Link
href={leagueHref}
onClick={(e) => e.stopPropagation()}
@@ -132,13 +131,13 @@ export function RaceListItem({
<Text as="span" color="text-primary-accent">{leagueName}</Text>
<Icon icon={ArrowRight} size={3} ml={2} color="var(--primary-accent)" />
</Link>
</Box>
</Stack>
)}
</Box>
</Stack>
{/* Arrow */}
<Icon icon={ChevronRight} size={5} color="var(--text-gray-500)" flexShrink={0} groupHoverTextColor="text-primary-accent" transition />
</Stack>
</Box>
</Stack>
);
}