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-19 18:01:30 +01:00
parent 6154d54435
commit 61b5cf3b64
120 changed files with 2226 additions and 2021 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
apps/website/templates/RosterAdminTemplate.tsx
View File

@@ -42,11 +42,11 @@ export function RosterAdminTemplate({
<Box>
<Stack direction="row" align="center" justify="between" mb={4}>
<Stack direction="row" align="center" gap={2}>
<Icon icon={UserPlus} size={4} color="text-primary-blue" />
<Heading level={5} color="text-primary-blue">PENDING JOIN REQUESTS</Heading>
<Icon icon={UserPlus} size={4} color="primary-accent" />
<Heading level={5} color="primary-accent">PENDING JOIN REQUESTS</Heading>
</Stack>
<Box px={2} py={0.5} rounded="md" bg="bg-primary-blue/10" border borderColor="border-primary-blue/20">
<Text size="xs" color="text-primary-blue" weight="bold">{pendingCountLabel}</Text>
<Box px={2} py={0.5} rounded="md" bg="rgba(25,140,255,0.1)" border borderColor="rgba(25,140,255,0.2)">
<Text size="xs" color="primary-accent" weight="bold">{pendingCountLabel}</Text>
</Box>
</Stack>
@@ -58,13 +58,13 @@ export function RosterAdminTemplate({
<Surface variant="dark" border rounded="lg" overflow="hidden">
<Stack gap={0}>
{joinRequests.map((req) => (
<Box key={req.id} p={4} borderBottom borderColor="border-charcoal-outline" hoverBg="bg-white/5" transition>
<Box key={req.id} p={4} borderBottom borderColor="rgba(255,255,255,0.1)">
<Stack direction={{ base: 'col', md: 'row' }} align="center" justify="between" gap={4}>
<Stack gap={1}>
<Text weight="bold" color="text-white">{req.driver.name}</Text>
<Text weight="bold" color="white">{req.driver.name}</Text>
<Text size="xs" color="text-gray-500">{req.formattedRequestedAt}</Text>
{req.message && (
<Text size="sm" color="text-gray-400" mt={1}>&quot;{req.message}&quot;</Text>
<Text size="sm" color="text-gray-400" mt={1}>"{req.message}"</Text>
)}
</Stack>
@@ -91,8 +91,8 @@ export function RosterAdminTemplate({
{/* Members Section */}
<Box>
<Stack direction="row" align="center" gap={2} mb={4}>
<Icon icon={Shield} size={4} color="text-performance-green" />
<Heading level={5} color="text-performance-green">ACTIVE ROSTER</Heading>
<Icon icon={Shield} size={4} color="text-success-green" />
<Heading level={5} color="text-success-green">ACTIVE ROSTER</Heading>
</Stack>
{loading ? (
@@ -114,7 +114,7 @@ export function RosterAdminTemplate({
{members.map((member) => (
<TableRow key={member.driverId}>
<TableCell>
<Text weight="bold" color="text-white">{member.driver.name}</Text>
<Text weight="bold" color="white">{member.driver.name}</Text>
</TableCell>
<TableCell>
<Text size="sm" color="text-gray-400">{member.formattedJoinedAt}</Text>
@@ -124,15 +124,13 @@ export function RosterAdminTemplate({
as="select"
value={member.role}
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => onRoleChange(member.driverId, e.target.value as MembershipRole)}
bg="bg-iron-gray"
bg="rgba(255,255,255,0.05)"
border
borderColor="border-charcoal-outline"
borderColor="rgba(255,255,255,0.1)"
rounded="md"
px={2}
py={1}
fontSize="xs"
weight="bold"
color="text-white"
color="white"
>
{roleOptions.map((role) => (
<Box as="option" key={role} value={role}>{role.toUpperCase()}</Box>
@@ -146,8 +144,8 @@ export function RosterAdminTemplate({
size="sm"
>
<Stack direction="row" align="center" gap={1.5}>
<Icon icon={UserMinus} size={3.5} color="text-error-red" />
<Text size="xs" weight="bold" color="text-error-red">REMOVE</Text>
<Icon icon={UserMinus} size={3.5} color="critical-red" />
<Text size="xs" weight="bold" color="critical-red">REMOVE</Text>
</Stack>
</Button>
</TableCell>