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

39
apps/website/components/teams/TeamHeaderPanel.tsx
View File

@@ -1,5 +1,4 @@
import React, { ReactNode } from 'react';
import { Box } from '@/ui/Box';
import { Stack } from '@/ui/Stack';
import { Heading } from '@/ui/Heading';
import { Text } from '@/ui/Text';
@@ -30,7 +29,7 @@ export function TeamHeaderPanel({
actions,
}: TeamHeaderPanelProps) {
return (
<Box
<Stack
bg="surface-charcoal"
border
borderColor="border-steel-grey"
@@ -38,12 +37,12 @@ export function TeamHeaderPanel({
className="relative overflow-hidden"
>
{/* Instrument-grade accent corner */}
<Box position="absolute" top="-1px" left="-1px" w="4" h="4" borderTop borderLeft borderColor="primary-blue/40" />
<Stack position="absolute" top="-1px" left="-1px" w="4" h="4" borderTop borderLeft borderColor="primary-blue/40" />
<Stack direction="row" align="start" justify="between" wrap gap={6}>
<Stack direction="row" align="start" gap={6} wrap flexGrow={1}>
{/* Logo Container */}
<Box
<Stack
w="24"
h="24"
bg="base-graphite"
@@ -56,10 +55,10 @@ export function TeamHeaderPanel({
>
<TeamLogo teamId={teamId} alt={name} />
{/* Corner detail */}
<Box position="absolute" bottom="0" right="0" w="2" h="2" bg="primary-blue/20" />
</Box>
<Stack position="absolute" bottom="0" right="0" w="2" h="2" bg="primary-blue/20" />
</Stack>
<Box flexGrow={1} minWidth="0">
<Stack flexGrow={1} minWidth="0">
<Stack direction="row" align="center" gap={3} mb={2}>
<Heading level={1} weight="bold" className="tracking-tight">{name}</Heading>
{tag && <TeamTag tag={tag} />}
@@ -72,29 +71,29 @@ export function TeamHeaderPanel({
)}
<Stack direction="row" align="center" gap={4} wrap>
<Box display="flex" alignItems="center" gap={1.5}>
<Box w="1.5" h="1.5" bg="primary-blue" />
<Stack display="flex" alignItems="center" gap={1.5}>
<Stack w="1.5" h="1.5" bg="primary-blue" />
<Text size="xs" color="text-gray-300" font="mono" className="uppercase tracking-wider">
{memberCount} {memberCount === 1 ? 'Member' : 'Members'}
</Text>
</Box>
</Stack>
{category && (
<Box display="flex" alignItems="center" gap={1.5}>
<Box w="1.5" h="1.5" bg="telemetry-aqua" />
<Stack display="flex" alignItems="center" gap={1.5}>
<Stack w="1.5" h="1.5" bg="telemetry-aqua" />
<Text size="xs" color="text-gray-300" font="mono" className="uppercase tracking-wider">
{category}
</Text>
</Box>
</Stack>
)}
{activeLeaguesCount !== undefined && (
<Box display="flex" alignItems="center" gap={1.5}>
<Box w="1.5" h="1.5" bg="warning-amber" />
<Stack display="flex" alignItems="center" gap={1.5}>
<Stack w="1.5" h="1.5" bg="warning-amber" />
<Text size="xs" color="text-gray-300" font="mono" className="uppercase tracking-wider">
{activeLeaguesCount} {activeLeaguesCount === 1 ? 'League' : 'Leagues'}
</Text>
</Box>
</Stack>
)}
{foundedDate && (
@@ -103,15 +102,15 @@ export function TeamHeaderPanel({
</Text>
)}
</Stack>
</Box>
</Stack>
</Stack>
{actions && (
<Box>
<Stack>
{actions}
</Box>
</Stack>
)}
</Stack>
</Box>
</Stack>
);
}