Files
037a2cf1-030e-4f05-95f9-157…/src/app/page.tsx
2026-03-03 02:48:48 +00:00

177 lines
7.9 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Flower2, Heart, Mail } from 'lucide-react';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="compact"
sizing="largeSmall"
background="fluid"
cardStyle="inset"
primaryButtonStyle="flat"
secondaryButtonStyle="layered"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="Erika"
navItems={[
{ name: "Our Story", id: "about" },
{ name: "The Book", id: "book" },
{ name: "Advocacy", id: "advocacy" },
{ name: "Shop", id: "shop" }
]}
button={{ text: "Get the Book", href: "cta" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroCentered
title="A Big World, a Gentle Heart"
description="Meet Erika and Learn to Sign"
background={{ variant: "plain" }}
avatars={[
{ src: "http://img.b2bpic.net/free-photo/pretty-girl-bright-dress-poses-field_8353-128.jpg", alt: "Erika standing on hillside" }
]}
buttons={[
{ text: "Watch Erika Sign", href: "#book" }
]}
buttonAnimation="slide-up"
ariaLabel="Hero section introducing Erika's story"
/>
</div>
<div id="about" data-section="about">
<AboutMetric
title="Our Story"
metrics={[
{ icon: Flower2, label: "Gratitude", value: "Joy in Small Moments" },
{ icon: Heart, label: "Inclusion & Advocacy", value: "Celebrating Differences" }
]}
metricsAnimation="slide-up"
useInvertedBackground={false}
ariaLabel="Our mission and values section"
/>
</div>
<div id="book" data-section="book">
<FeatureCardTwentySeven
title="Global Heart"
description="Love Without Borders"
tag="Featured"
features={[
{
id: "1", title: "A Story for Every Child", description: "Written with a soft but strong message of empathy, this book is a safe space that celebrates our differences and teaches that love can bridge any distance.", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-world-book-day-concept_23-2148474507.jpg", imageAlt: "Love Without Borders book cover"
},
{
id: "2", title: "Journey from the Himalayas", description: "Follow Erika as she travels from her village in the Himalayas to the furthest stars, showing us that we all belong in this beautiful world.", imageSrc: "http://img.b2bpic.net/free-photo/travelling-nepal_8327-281.jpg", imageAlt: "Prayer flags in Bhutanese landscape"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground="noInvert"
ariaLabel="The Book section showcasing Erika's story"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
title="What People Are Saying"
description="Hear from families, educators, and advocates touched by Erika's story"
testimonials={[
{
id: "1", name: "Sarah Martinez", role: "Parent", company: "Autism Community", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-parents-with-baby_1098-1201.jpg", imageAlt: "Sarah Martinez"
},
{
id: "2", name: "James Chen", role: "Special Education Teacher", company: "Inclusive Schools", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-senior-businessman-library_1262-2398.jpg", imageAlt: "James Chen"
},
{
id: "3", name: "Dr. Pema Tshering", role: "Advocacy Director", company: "Bhutan Accessibility Network", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-posing_23-2149429383.jpg", imageAlt: "Dr. Pema Tshering"
},
{
id: "4", name: "Jennifer Williams", role: "Children's Librarian", company: "Community Libraries", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-library_23-2148680199.jpg", imageAlt: "Jennifer Williams"
},
{
id: "5", name: "Michael Park", role: "Parent & Advocate", company: "Inclusion Matters", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/couple-enjoying-winter-home-lifestyle_23-2149198810.jpg", imageAlt: "Michael Park"
},
{
id: "6", name: "Ana Rodriguez", role: "Community Organizer", company: "Global Hearts Initiative", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-people-with-clothes_23-2149196128.jpg", imageAlt: "Ana Rodriguez"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
ariaLabel="Testimonials from families and educators"
/>
</div>
<div id="cta" data-section="cta">
<ContactCTA
tag="Take Action"
tagIcon={Heart}
title="Let's Build a More Gentle World, Together"
description="Join us in spreading kindness, inclusion, and the beautiful message that love knows no borders. Get Erika's book today and be part of this movement."
buttons={[
{ text: "Get the Book", href: "#shop" },
{ text: "Learn About Advocacy", href: "#advocacy" }
]}
buttonAnimation="slide-up"
background={{ variant: "plain" }}
useInvertedBackground={false}
ariaLabel="Call to action for book purchase and advocacy"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Erika's World"
columns={[
{
items: [
{ label: "Our Story", href: "#about" },
{ label: "The Book", href: "#book" },
{ label: "Shop", href: "#shop" }
]
},
{
items: [
{ label: "Advocacy", href: "#advocacy" },
{ label: "About Us", href: "#about" },
{ label: "Contact", href: "#contact" }
]
},
{
items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Follow Us", href: "#" }
]
}
]}
ariaLabel="Site footer with navigation"
/>
</div>
</ThemeProvider>
);
}