Merge version_1 into main #1
457
src/app/page.tsx
457
src/app/page.tsx
@@ -12,332 +12,167 @@ import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import { Award, Heart, Home } from "lucide-react";
|
||||
import { Heart, Home, Award } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Adopt",
|
||||
id: "#animals",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Stats",
|
||||
id: "#metrics",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Paws & Hope"
|
||||
button={{
|
||||
text: "Donate",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Adopt", id: "#animals" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Stats", id: "#metrics" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
brandName="Paws & Hope"
|
||||
button={{ text: "Donate", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
title="Give a Second Chance to a Loyal Friend"
|
||||
description="Connecting local rescues with loving homes. Discover your future companion today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Find a Pet",
|
||||
href: "#animals",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/full-shot-dog-sitting-near-adopt-me-banner_23-2148699635.jpg"
|
||||
imageAlt="Rescue dog waiting for adoption"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/full-shot-woman-with-pet-carrier_23-2150238728.jpg",
|
||||
alt: "Full shot woman with pet carrier",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-young-girl-with-her-pet-dog_23-2150847009.jpg",
|
||||
alt: "Portrait of young girl with her pet dog",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/full-shot-woman-with-pet-carrier_23-2150238731.jpg",
|
||||
alt: "Full shot woman with pet carrier",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/full-shot-woman-petting-happy-dog_23-2148928962.jpg",
|
||||
alt: "Full shot woman petting happy dog",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/full-shot-dog-sitting-near-adopt-me-banner_23-2148699635.jpg",
|
||||
alt: "Rescue dog waiting for adoption",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 1,200+ happy adopters"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Adoptions Open Daily",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Rescue & Foster",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Volunteer Needs",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Support Our Cause",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Community Outreach",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Give a Second Chance to a Loyal Friend"
|
||||
description="Connecting local rescues with loving homes. Discover your future companion today."
|
||||
buttons={[{ text: "Find a Pet", href: "#animals" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/full-shot-dog-sitting-near-adopt-me-banner_23-2148699635.jpg"
|
||||
imageAlt="Rescue dog waiting for adoption"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/full-shot-woman-with-pet-carrier_23-2150238728.jpg", alt: "Full shot woman with pet carrier" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-young-girl-with-her-pet-dog_23-2150847009.jpg", alt: "Portrait of young girl with her pet dog" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/full-shot-woman-with-pet-carrier_23-2150238731.jpg", alt: "Full shot woman with pet carrier" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/full-shot-woman-petting-happy-dog_23-2148928962.jpg", alt: "Full shot woman petting happy dog" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/full-shot-dog-sitting-near-adopt-me-banner_23-2148699635.jpg", alt: "Rescue dog waiting for adoption" }
|
||||
]}
|
||||
avatarText="Join 1,200+ happy adopters"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Adoptions Open Daily" },
|
||||
{ type: "text", text: "Rescue & Foster" },
|
||||
{ type: "text", text: "Volunteer Needs" },
|
||||
{ type: "text", text: "Support Our Cause" },
|
||||
{ type: "text", text: "Community Outreach" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Mission to Save Lives"
|
||||
buttons={[
|
||||
{
|
||||
text: "How We Help",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Mission to Save Lives"
|
||||
buttons={[{ text: "How We Help", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="animals" data-section="animals">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Buddy",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-dogs-waiting-be-fostered-by-someone_23-2148682987.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Luna",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-abyssinian-cat-resting-soft-pillow_181624-56547.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Max",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dog-looking-forward_1388-205.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Bella",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elderly-person-spendng-tim-with-their-pets_23-2149486392.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Charlie",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-dog-with-adopt-me-banner_23-2148699617.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Daisy",
|
||||
price: "Available",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-domestic-cat-sky-blue-sheets-looking-up-with-funny-look_181624-11545.jpg",
|
||||
},
|
||||
]}
|
||||
title="Meet Our Pets"
|
||||
description="Browse our currently available pets looking for their forever homes."
|
||||
/>
|
||||
</div>
|
||||
<div id="animals" data-section="animals">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "1", name: "Buddy", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/cute-dogs-waiting-be-fostered-by-someone_23-2148682987.jpg" },
|
||||
{ id: "2", name: "Luna", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/cute-abyssinian-cat-resting-soft-pillow_181624-56547.jpg" },
|
||||
{ id: "3", name: "Max", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/dog-looking-forward_1388-205.jpg" },
|
||||
{ id: "4", name: "Bella", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/elderly-person-spendng-tim-with-their-pets_23-2149486392.jpg" },
|
||||
{ id: "5", name: "Charlie", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/cute-dog-with-adopt-me-banner_23-2148699617.jpg" },
|
||||
{ id: "6", name: "Daisy", price: "Available", imageSrc: "http://img.b2bpic.net/free-photo/cute-domestic-cat-sky-blue-sheets-looking-up-with-funny-look_181624-11545.jpg" }
|
||||
]}
|
||||
title="Meet Our Pets"
|
||||
description="Browse our currently available pets looking for their forever homes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Heart,
|
||||
title: "Pets Adopted",
|
||||
value: "1,240+",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Home,
|
||||
title: "Successful Foster Stays",
|
||||
value: "450+",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Award,
|
||||
title: "Years Serving Animals",
|
||||
value: "12",
|
||||
},
|
||||
]}
|
||||
title="Shelter Milestones"
|
||||
description="Proudly serving our community and our furry friends for over a decade."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", icon: Heart, title: "Pets Adopted", value: "1,240+" },
|
||||
{ id: "m2", icon: Home, title: "Successful Foster Stays", value: "450+" },
|
||||
{ id: "m3", icon: Award, title: "Years Serving Animals", value: "12" }
|
||||
]}
|
||||
title="Shelter Milestones"
|
||||
description="Proudly serving our community and our furry friends for over a decade."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
handle: "@sarah_j",
|
||||
testimonial: "Best decision I ever made. Buddy is part of our family now.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/inspired-positive-dark-skinned-woman-enjoys-pets-company_273609-25510.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Michael C.",
|
||||
handle: "@m_chen",
|
||||
testimonial: "The shelter made the transition process so easy and supportive.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-dogowner-spending-time-with-his-pet-cafe-sitting-indoors-looking-outside-window_1258-314758.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Emily R.",
|
||||
handle: "@emily_r",
|
||||
testimonial: "So thankful for the team at Paws & Hope for helping us find Luna.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-spending-time-together-outdoors_23-2148704481.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "David K.",
|
||||
handle: "@d_kim",
|
||||
testimonial: "Our cat is the sweetest addition to our home. Thank you!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-african-man-holding-cat-blue-wall_176420-2338.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Jessica M.",
|
||||
handle: "@jess_m",
|
||||
testimonial: "Incredible staff who really care about every pet in their charge.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-with-cute-dog_23-2147986385.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Happy Tails Success Stories"
|
||||
description="See how our rescue pets have brought joy to families across the city."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah J.", handle: "@sarah_j", testimonial: "Best decision I ever made. Buddy is part of our family now.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/inspired-positive-dark-skinned-woman-enjoys-pets-company_273609-25510.jpg" },
|
||||
{ id: "t2", name: "Michael C.", handle: "@m_chen", testimonial: "The shelter made the transition process so easy and supportive.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-dogowner-spending-time-with-his-pet-cafe-sitting-indoors-looking-outside-window_1258-314758.jpg" },
|
||||
{ id: "t3", name: "Emily R.", handle: "@emily_r", testimonial: "So thankful for the team at Paws & Hope for helping us find Luna.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-couple-spending-time-together-outdoors_23-2148704481.jpg" },
|
||||
{ id: "t4", name: "David K.", handle: "@d_kim", testimonial: "Our cat is the sweetest addition to our home. Thank you!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-african-man-holding-cat-blue-wall_176420-2338.jpg" },
|
||||
{ id: "t5", name: "Jessica M.", handle: "@jess_m", testimonial: "Incredible staff who really care about every pet in their charge.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-couple-with-cute-dog_23-2147986385.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="Happy Tails Success Stories"
|
||||
description="See how our rescue pets have brought joy to families across the city."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How long is the adoption process?",
|
||||
content: "Typically 3-5 days including home visits and paperwork.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What vaccinations are included?",
|
||||
content: "All pets are microchipped and vaccinated prior to adoption.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I foster before I adopt?",
|
||||
content: "Yes, we encourage foster-to-adopt programs for suitable pets.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Adoption FAQ"
|
||||
faqsAnimation="slide-up"
|
||||
sideDescription="Common questions about bringing a new pet home."
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "How long is the adoption process?", content: "Typically 3-5 days including home visits and paperwork." },
|
||||
{ id: "f2", title: "What vaccinations are included?", content: "All pets are microchipped and vaccinated prior to adoption." },
|
||||
{ id: "f3", title: "Can I foster before I adopt?", content: "Yes, we encourage foster-to-adopt programs for suitable pets." }
|
||||
]}
|
||||
sideTitle="Adoption FAQ"
|
||||
faqsAnimation="slide-up"
|
||||
sideDescription="Common questions about bringing a new pet home."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social" data-section="social">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Local Vet Alliance",
|
||||
"Community Pet Fund",
|
||||
"Animal Welfare Network",
|
||||
"Rescue Supplies Co.",
|
||||
"Helping Paws Foundation",
|
||||
"City Pet Registry",
|
||||
"Happy Tails Supplies",
|
||||
]}
|
||||
title="Supported By Our Partners"
|
||||
description="We are honored to work alongside these dedicated local organizations."
|
||||
/>
|
||||
</div>
|
||||
<div id="social" data-section="social">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={["Local Vet Alliance", "Community Pet Fund", "Animal Welfare Network", "Rescue Supplies Co.", "Helping Paws Foundation", "City Pet Registry", "Happy Tails Supplies"]}
|
||||
title="Supported By Our Partners"
|
||||
description="We are honored to work alongside these dedicated local organizations."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Reach Out to Adopt or Volunteer"
|
||||
description="Have questions? Our team is here to help you get started."
|
||||
inputs={[
|
||||
{
|
||||
name: "fullName",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-walking-out-her-dog-autumn-park_1303-17252.jpg"
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help you?",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Reach Out to Adopt or Volunteer"
|
||||
description="Have questions? Our team is here to help you get started."
|
||||
inputs={[
|
||||
{ name: "fullName", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-walking-out-her-dog-autumn-park_1303-17252.jpg"
|
||||
textarea={{ name: "message", placeholder: "How can we help you?", rows: 4, required: true }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Paws & Hope"
|
||||
copyrightText="© 2025 Paws & Hope Animal Shelter"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="Paws & Hope"
|
||||
copyrightText="© 2025 Paws & Hope Animal Shelter"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user