Update src/app/page.tsx
This commit is contained in:
162
src/app/page.tsx
162
src/app/page.tsx
@@ -2,17 +2,14 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { CheckCircle, Heart, Star, Sparkles, Smile, Sun } from "lucide-react";
|
||||
import { CheckCircle, Smile, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,85 +26,96 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Habits", id: "habits" },
|
||||
{ name: "Benefits", id: "benefits" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" }
|
||||
]}
|
||||
brandName="HabitHero"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Habits", id: "habits" },
|
||||
{ name: "Benefits", id: "benefits" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" }
|
||||
]}
|
||||
brandName="HabitHero"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Little Habits, Big Adventures!"
|
||||
description="Helping children build positive habits that last a lifetime, one fun step at a time."
|
||||
mediaAnimation="blur-reveal"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-kids-playing-outdoors_1150-13611.jpg"
|
||||
imageAlt="Happy children learning habits"
|
||||
buttons={[{ text: "Start Learning", href: "#habits" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Little Habits, Big Adventures!"
|
||||
description="Helping children build positive habits that last a lifetime, one fun step at a time."
|
||||
mediaAnimation="blur-reveal"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-kids-playing-outdoors_1150-13611.jpg"
|
||||
imageAlt="Happy children learning habits"
|
||||
buttons={[{ text: "Start Learning", href: "#habits" }]}
|
||||
testimonials={[
|
||||
{ name: "Sarah M.", handle: "@sarahm", testimonial: "My kids actually look forward to cleaning their rooms now!", rating: 5 }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="habits" data-section="habits">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
title="Our Daily Habits"
|
||||
description="Discover simple, easy-to-follow routines that make life better and healthier."
|
||||
features={[
|
||||
{ id: "h1", title: "Brush Teeth", tags: ["Hygiene", "Morning"], imageSrc: "http://img.b2bpic.net/free-photo/child-brushing-teeth_23-2148700000.jpg" },
|
||||
{ id: "h2", title: "Eat Vegetables", tags: ["Health", "Lunch"], imageSrc: "http://img.b2bpic.net/free-photo/kid-eating-broccoli_23-2148700001.jpg" },
|
||||
{ id: "h3", title: "Clean Up Toys", tags: ["Responsibility", "Daily"], imageSrc: "http://img.b2bpic.net/free-photo/kid-cleaning-toys_23-2148700002.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="habits" data-section="habits">
|
||||
<FeatureCardTwentyThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
title="Our Daily Habits"
|
||||
description="Discover simple, easy-to-follow routines that make life better and healthier."
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ id: "h1", title: "Brush Teeth", tags: ["Hygiene", "Morning"], imageSrc: "http://img.b2bpic.net/free-photo/child-brushing-teeth_23-2148700000.jpg" },
|
||||
{ id: "h2", title: "Eat Vegetables", tags: ["Health", "Lunch"], imageSrc: "http://img.b2bpic.net/free-photo/kid-eating-broccoli_23-2148700001.jpg" },
|
||||
{ id: "h3", title: "Clean Up Toys", tags: ["Responsibility", "Daily"], imageSrc: "http://img.b2bpic.net/free-photo/kid-cleaning-toys_23-2148700002.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
title="Habit Impact"
|
||||
description="Seeing the positive changes in our community."
|
||||
metrics={[
|
||||
{ id: "m1", value: "1000+", title: "Habits Mastered", description: "Completed by kids", icon: CheckCircle },
|
||||
{ id: "m2", value: "500+", title: "Daily Smiles", description: "Shared with us", icon: Smile },
|
||||
{ id: "m3", value: "99%", title: "Fun Factor", description: "Reported by kids", icon: Star }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Habit Impact"
|
||||
description="Seeing the positive changes in our community."
|
||||
metrics={[
|
||||
{ id: "m1", value: "1000+", title: "Habits Mastered", description: "Completed by kids", icon: CheckCircle },
|
||||
{ id: "m2", value: "500+", title: "Daily Smiles", description: "Shared with us", icon: Smile },
|
||||
{ id: "m3", value: "99%", title: "Fun Factor", description: "Reported by kids", icon: Star }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
title="Happy Parents & Kids"
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Jane Doe", date: "2023-10-01", title: "Parent", quote: "My kids actually look forward to cleaning their rooms now!", tag: "Fun", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman_23-2148972605.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
title="Happy Parents & Kids"
|
||||
description="What our community says about us."
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Jane Doe", date: "2023-10-01", title: "Parent", quote: "My kids actually look forward to cleaning their rooms now!", tag: "Fun", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman_23-2148972605.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
faqsAnimation="slide-up"
|
||||
title="Frequently Asked Questions"
|
||||
faqs={[
|
||||
{ id: "q1", title: "Is it free?", content: "Yes, all habit guides are free for everyone." },
|
||||
{ id: "q2", title: "Can I add my own?", content: "Yes, contact us to suggest new habits." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
faqsAnimation="slide-up"
|
||||
sideTitle="Frequently Asked Questions"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Is it free?", content: "Yes, all habit guides are free for everyone." },
|
||||
{ id: "q2", title: "Can I add my own?", content: "Yes, contact us to suggest new habits." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="HabitHero"
|
||||
columns={[{ items: [{ label: "Home" }, { label: "About" }] }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="HabitHero"
|
||||
leftLink={{ text: "Home", href: "/" }}
|
||||
rightLink={{ text: "About", href: "#" }}
|
||||
columns={[{ items: [{ label: "Home" }, { label: "About" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user