79 lines
3.4 KiB
TypeScript
79 lines
3.4 KiB
TypeScript
import Section from '@/components/ui/Section';
|
|
import Container from '@/components/ui/Container';
|
|
import Heading from '@/components/ui/Heading';
|
|
import MockupStack from '@/components/ui/MockupStack';
|
|
import LeagueHomeMockup from '@/components/mockups/LeagueHomeMockup';
|
|
import StandingsTableMockup from '@/components/mockups/StandingsTableMockup';
|
|
import TeamCompetitionMockup from '@/components/mockups/TeamCompetitionMockup';
|
|
import ProtestWorkflowMockup from '@/components/mockups/ProtestWorkflowMockup';
|
|
import LeagueDiscoveryMockup from '@/components/mockups/LeagueDiscoveryMockup';
|
|
import DriverProfileMockup from '@/components/mockups/DriverProfileMockup';
|
|
|
|
const features = [
|
|
{
|
|
title: "A Real Home for Your League",
|
|
description: "Stop juggling Discord, spreadsheets, and iRacing admin panels. GridPilot brings everything into one dedicated platform built specifically for league racing.",
|
|
MockupComponent: LeagueHomeMockup
|
|
},
|
|
{
|
|
title: "Automatic Results & Standings",
|
|
description: "Race happens. Results appear. Standings update. No manual data entry, no spreadsheet formulas, no waiting for someone to publish.",
|
|
MockupComponent: StandingsTableMockup
|
|
},
|
|
{
|
|
title: "Real Team Racing",
|
|
description: "Constructors' championships that actually matter. Driver lineups. Team strategies. Multi-class racing done right.",
|
|
MockupComponent: TeamCompetitionMockup
|
|
},
|
|
{
|
|
title: "Clean Protests & Penalties",
|
|
description: "Structured incident reporting with video clip references. Steward review workflows. Transparent penalty application. Professional race control.",
|
|
MockupComponent: ProtestWorkflowMockup
|
|
},
|
|
{
|
|
title: "Find Your Perfect League",
|
|
description: "Search and discover leagues by game, region, and skill level. Browse featured competitions, check driver counts, and join communities that match your racing style.",
|
|
MockupComponent: LeagueDiscoveryMockup
|
|
},
|
|
{
|
|
title: "Your Racing Identity",
|
|
description: "Cross-league driver profiles with career stats, achievements, and racing history. Build your reputation across multiple championships and showcase your progression.",
|
|
MockupComponent: DriverProfileMockup
|
|
}
|
|
];
|
|
|
|
export default function FeatureGrid() {
|
|
return (
|
|
<Section variant="default">
|
|
<Container>
|
|
<Container size="sm" center>
|
|
<Heading level={2} className="text-white">
|
|
Built for League Racing
|
|
</Heading>
|
|
<p className="mt-4 text-lg text-gray-400">
|
|
Everything you need to run a professional iRacing league, nothing you don't
|
|
</p>
|
|
</Container>
|
|
<div className="mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-16 sm:mt-20 lg:max-w-none lg:grid-cols-2 xl:grid-cols-3">
|
|
{features.map((feature, index) => (
|
|
<div key={feature.title} className="flex flex-col gap-6">
|
|
<div className="aspect-video w-full">
|
|
<MockupStack index={index}>
|
|
<feature.MockupComponent />
|
|
</MockupStack>
|
|
</div>
|
|
<div>
|
|
<Heading level={3} className="text-white">
|
|
{feature.title}
|
|
</Heading>
|
|
<p className="mt-2 text-base leading-7 text-gray-400">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</Container>
|
|
</Section>
|
|
);
|
|
} |