36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
import React from 'react';
|
|
import { Card } from '@/ui/Card';
|
|
import { Button } from '@/ui/Button';
|
|
import { Box } from '@/ui/Box';
|
|
import { Text } from '@/ui/Text';
|
|
import { Heading } from '@/ui/Heading';
|
|
|
|
export function FeedEmptyState() {
|
|
return (
|
|
<Card bg="bg-iron-gray/80" border={true} borderColor="border-charcoal-outline" className="border-dashed">
|
|
<Box textAlign="center" py={10}>
|
|
<Text size="3xl" block mb={3}>🏁</Text>
|
|
<Box mb={2}>
|
|
<Heading level={3}>
|
|
Your feed is warming up
|
|
</Heading>
|
|
</Box>
|
|
<Box maxWidth="md" mx="auto" mb={4}>
|
|
<Text size="sm" color="text-gray-400">
|
|
As leagues, teams, and friends start racing, this feed will show their latest results,
|
|
signups, and highlights.
|
|
</Text>
|
|
</Box>
|
|
<Button
|
|
as="a"
|
|
href="/leagues"
|
|
variant="secondary"
|
|
size="sm"
|
|
>
|
|
Explore leagues
|
|
</Button>
|
|
</Box>
|
|
</Card>
|
|
);
|
|
}
|