[go: up one dir, main page]

0% found this document useful (0 votes)
7 views2 pages

Code

The document outlines a React component for a homepage that includes a Navbar, Hero section, Social Proof section, and a Toolkit Showcase featuring three different toolkit packs. Each toolkit card provides an image, pack type, price, and description. The component is designed with a clean layout and includes placeholders for additional sections like Pricing and Footer.

Uploaded by

lekyyrn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views2 pages

Code

The document outlines a React component for a homepage that includes a Navbar, Hero section, Social Proof section, and a Toolkit Showcase featuring three different toolkit packs. Each toolkit card provides an image, pack type, price, and description. The component is designed with a clean layout and includes placeholders for additional sections like Pricing and Footer.

Uploaded by

lekyyrn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

import { Navbar } from '@/components/Navbar';

import { Hero } from '@/components/Hero';


import { ToolkitCard } from '@/components/ToolkitCard';
import { Testimonial } from '@/components/Testimonial';
// You would create Footer, Pricing, and SocialProof components similarly

export default function HomePage() {


return (
<main className="bg-cream-white">
<Navbar />
<Hero />

{/* Social Proof Section (simplified example) */}


<div className="py-8 bg-cream-white">
<p className="text-center text-sm font-bold tracking-widest
text-graphite/50">
TRUSTED BY FOUNDERS AT
</p>
{/* Add logos here */}
</div>

{/* Toolkit Showcase Section */}


<section id="toolkits" className="py-20">
<div className="container mx-auto px-4">
<h2 className="text-4xl md:text-5xl font-bold text-center mb-12">The
Founder's Suite.</h2>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
<ToolkitCard
imageUrl="/images/toolkit-free.jpg" // Add images to /public/images
packType="Free Pack"
price="$0"
description="A curated selection of essential resources to get your
idea off the ground."
/>
<ToolkitCard
imageUrl="/images/toolkit-starter.jpg"
packType="Starter Pack"
price="$49"
description="The complete launch kit. Validate, build, and launch
your MVP with confidence."
/>
<ToolkitCard
imageUrl="/images/toolkit-pro.jpg"
packType="Pro Pack"
price="$99"
description="Unlock the entire suite. Advanced strategies for growth,
marketing, and operations."
isPopular={true}
/>
</div>
</div>
</section>

<Testimonial />

{/* Add Pricing and Footer sections here */}


{/* <Pricing /> */}
{/* <Footer /> */}
</main>
);
}

You might also like