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

33
apps/website/components/drivers/DriverRacingProfile.tsx
View File

@@ -3,7 +3,6 @@
import React from 'react';
import { Heading } from '@/ui/Heading';
import { Text } from '@/ui/Text';
import { Box } from '@/ui/Box';
import { Stack } from '@/ui/Stack';
import { MapPin, Car, Clock, Users2, MailCheck } from 'lucide-react';
@@ -32,45 +31,45 @@ export function DriverRacingProfile({
];
return (
<Box display="flex" flexDirection="col" gap={6} rounded="2xl" border borderColor="border-charcoal-outline" bg="bg-deep-charcoal/50" p={6}>
<Box display="flex" alignItems="center" justifyContent="between">
<Stack display="flex" flexDirection="col" gap={6} rounded="2xl" border borderColor="border-charcoal-outline" bg="bg-deep-charcoal/50" p={6}>
<Stack display="flex" alignItems="center" justifyContent="between">
<Heading level={3}>Racing Profile</Heading>
<Stack direction="row" gap={2}>
{lookingForTeam && (
<Box display="flex" alignItems="center" gap={1.5} rounded="full" bg="bg-primary-blue/10" border borderColor="border-primary-blue/20" px={3} py={1}>
<Stack display="flex" alignItems="center" gap={1.5} rounded="full" bg="bg-primary-blue/10" border borderColor="border-primary-blue/20" px={3} py={1}>
<Users2 size={12} color="#198CFF" />
<Text size="xs" weight="bold" color="text-primary-blue" uppercase letterSpacing="tight">Looking for Team</Text>
</Box>
</Stack>
)}
{openToRequests && (
<Box display="flex" alignItems="center" gap={1.5} rounded="full" bg="bg-performance-green/10" border borderColor="border-performance-green/20" px={3} py={1}>
<Stack display="flex" alignItems="center" gap={1.5} rounded="full" bg="bg-performance-green/10" border borderColor="border-performance-green/20" px={3} py={1}>
<MailCheck size={12} color="#22C55E" />
<Text size="xs" weight="bold" color="text-performance-green" uppercase letterSpacing="tight">Open to Requests</Text>
</Box>
</Stack>
)}
</Stack>
</Box>
</Stack>
<Box display="grid" gridCols={{ base: 1, sm: 2 }} gap={4}>
<Stack display="grid" gridCols={{ base: 1, sm: 2 }} gap={4}>
{details.map((detail, index) => {
const Icon = detail.icon;
return (
<Box key={index} display="flex" alignItems="center" gap={4} rounded="xl" border borderColor="border-charcoal-outline/50" bg="bg-deep-graphite/50" p={4}>
<Box display="flex" h="10" w="10" alignItems="center" justifyContent="center" rounded="lg" bg="bg-charcoal-outline/50" color="text-gray-400">
<Stack key={index} display="flex" alignItems="center" gap={4} rounded="xl" border borderColor="border-charcoal-outline/50" bg="bg-deep-graphite/50" p={4}>
<Stack display="flex" h="10" w="10" alignItems="center" justifyContent="center" rounded="lg" bg="bg-charcoal-outline/50" color="text-gray-400">
<Icon size={20} />
</Box>
<Box display="flex" flexDirection="col">
</Stack>
<Stack display="flex" flexDirection="col">
<Text size="xs" weight="bold" color="text-gray-500" uppercase letterSpacing="wider">
{detail.label}
</Text>
<Text size="sm" weight="semibold" color="text-white">
{detail.value}
</Text>
</Box>
</Box>
</Stack>
</Stack>
);
})}
</Box>
</Box>
</Stack>
</Stack>
);
}