website refactor
This commit is contained in:
@@ -1,84 +1,77 @@
|
||||
import { AppFooter } from '@/components/app/AppFooter';
|
||||
import { Box } from '@/ui/Box';
|
||||
import { Grid } from '@/ui/Grid';
|
||||
import { Stack } from '@/ui/Stack';
|
||||
import { Text } from '@/ui/Text';
|
||||
import Image from 'next/image';
|
||||
import Link from 'next/link';
|
||||
import { Link } from '@/ui/Link';
|
||||
import { BrandMark } from '@/ui/BrandMark';
|
||||
import { Box } from '@/ui/Box';
|
||||
|
||||
export interface GlobalFooterViewData {}
|
||||
|
||||
export function GlobalFooterTemplate(_props: GlobalFooterViewData) {
|
||||
return (
|
||||
<AppFooter>
|
||||
<Box maxWidth="7xl" mx="auto" display="grid" responsiveGridCols={{ base: 1, md: 4 }} gap={12}>
|
||||
<Box colSpan={{ base: 1, md: 2 }}>
|
||||
<Box mb={6} opacity={0.8}>
|
||||
<Image
|
||||
src="/images/logos/wordmark-rectangle-dark.svg"
|
||||
alt="GridPilot"
|
||||
width={140}
|
||||
height={26}
|
||||
/>
|
||||
</Box>
|
||||
<Box maxWidth="sm" mb={6}>
|
||||
<Text color="text-gray-500">
|
||||
<Grid cols={{ base: 1, md: 4 }} gap={12}>
|
||||
<Stack colSpan={{ base: 1, md: 2 }} gap={6}>
|
||||
<Stack direction="row" align="center" gap={4}>
|
||||
<BrandMark />
|
||||
<Box display={{ base: 'none', sm: 'flex' }} alignItems="center" gap={2} borderLeft borderColor="[#23272B]" pl={4}>
|
||||
<Box w="4px" h="4px" rounded="full" bg="primary-accent" animate="pulse" />
|
||||
<Text size="xs" variant="low" weight="bold" font="mono" letterSpacing="0.1em">
|
||||
INFRASTRUCTURE
|
||||
</Text>
|
||||
</Box>
|
||||
</Stack>
|
||||
<Stack maxWidth="sm">
|
||||
<Text variant="low" size="sm">
|
||||
The professional infrastructure for serious sim racing.
|
||||
Precision telemetry, automated results, and elite league management.
|
||||
</Text>
|
||||
</Box>
|
||||
<Box display="flex" alignItems="center" gap={4}>
|
||||
<Text size="xs" color="text-gray-600" font="mono" letterSpacing="widest">
|
||||
© 2026 GRIDPILOT
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
<Box>
|
||||
<Box mb={4}>
|
||||
<Text weight="bold" color="text-gray-300" letterSpacing="wider">PLATFORM</Text>
|
||||
</Box>
|
||||
<Stack gap={4}>
|
||||
<Text size="xs" weight="bold" variant="high" uppercase letterSpacing="wider">PLATFORM</Text>
|
||||
<Stack as="ul" direction="col" gap={2}>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/leagues" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
<Stack as="li">
|
||||
<Link href="/leagues" variant="secondary">
|
||||
Leagues
|
||||
</Box>
|
||||
</Box>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/teams" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
</Link>
|
||||
</Stack>
|
||||
<Stack as="li">
|
||||
<Link href="/teams" variant="secondary">
|
||||
Teams
|
||||
</Box>
|
||||
</Box>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/leaderboards" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
</Link>
|
||||
</Stack>
|
||||
<Stack as="li">
|
||||
<Link href="/leaderboards" variant="secondary">
|
||||
Leaderboards
|
||||
</Box>
|
||||
</Box>
|
||||
</Link>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Stack>
|
||||
|
||||
<Box>
|
||||
<Box mb={4}>
|
||||
<Text weight="bold" color="text-gray-300" letterSpacing="wider">SUPPORT</Text>
|
||||
</Box>
|
||||
<Stack gap={4}>
|
||||
<Text size="xs" weight="bold" variant="high" uppercase letterSpacing="wider">SUPPORT</Text>
|
||||
<Stack as="ul" direction="col" gap={2}>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/docs" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
<Stack as="li">
|
||||
<Link href="/docs" variant="secondary">
|
||||
Documentation
|
||||
</Box>
|
||||
</Box>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/status" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
</Link>
|
||||
</Stack>
|
||||
<Stack as="li">
|
||||
<Link href="/status" variant="secondary">
|
||||
System Status
|
||||
</Box>
|
||||
</Box>
|
||||
<Box as="li">
|
||||
<Box as={Link} href="/contact" color="text-gray-500" hoverTextColor="primary-accent" transition>
|
||||
</Link>
|
||||
</Stack>
|
||||
<Stack as="li">
|
||||
<Link href="/contact" variant="secondary">
|
||||
Contact
|
||||
</Box>
|
||||
</Box>
|
||||
</Link>
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Box>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</AppFooter>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user