52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { Section } from '@/ui/Section';
|
|
import { Heading } from '@/ui/Heading';
|
|
import { Text } from '@/ui/Text';
|
|
import { Button } from '@/ui/Button';
|
|
import { Group } from '@/ui/Group';
|
|
import { Box } from '@/ui/Box';
|
|
import { Panel } from '@/ui/Panel';
|
|
import { Stack } from '@/ui/Stack';
|
|
import { Icon } from '@/ui/Icon';
|
|
import { Trophy } from 'lucide-react';
|
|
|
|
/**
|
|
* CtaSection - Final call to action for league admins.
|
|
* Redesigned to match the "Modern Precision" theme and "Dieter Rams" style.
|
|
*/
|
|
export function CtaSection() {
|
|
return (
|
|
<Section variant="default" padding="lg">
|
|
<Panel variant="muted" padding="xl">
|
|
<Stack gap={12} align="center" textAlign="center">
|
|
<Stack gap={6} align="center">
|
|
<Box width="3rem" height="3rem" bg="var(--ui-color-bg-surface)" rounded="full" border={true} display="flex" alignItems="center" justifyContent="center">
|
|
<Icon icon={Trophy} size={6} intent="primary" />
|
|
</Box>
|
|
<Stack gap={4}>
|
|
<Heading level={2} weight="bold">
|
|
Ready to elevate your league?
|
|
</Heading>
|
|
<Text variant="med" size="lg" maxWidth="36rem">
|
|
Join the growing ecosystem of professional sim racing leagues.
|
|
Start for free and scale as your community grows.
|
|
</Text>
|
|
</Stack>
|
|
</Stack>
|
|
|
|
<Group gap={6} justify="center">
|
|
<Button variant="primary" size="lg">
|
|
Create Your League
|
|
</Button>
|
|
<Button variant="secondary" size="lg">
|
|
View Documentation
|
|
</Button>
|
|
</Group>
|
|
</Stack>
|
|
</Panel>
|
|
</Section>
|
|
);
|
|
}
|