275 lines
11 KiB
TypeScript
275 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import { Heart, Home, Users, Shield } from "lucide-react";
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="sharp"
|
|
contentWidth="small"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Happy Paws"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Pets", id: "pets" },
|
|
{ name: "Impact", id: "impact" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{
|
|
text: "Adopt Now",
|
|
href: "contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogo
|
|
logoText="Happy Paws"
|
|
description="Giving loving homes to animals in need. Every adoption saves a life and opens a heart."
|
|
buttons={[
|
|
{ text: "Adopt a Pet", href: "pets" },
|
|
{ text: "Learn More", href: "about" }
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/selective-focus-shot-adorable-kooikerhondje-dog_181624-55413.jpg?id=22859995"
|
|
imageAlt="Happy dogs and cats playing together"
|
|
showDimOverlay={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<SplitAbout
|
|
tag="Our Story"
|
|
title="We're Here to Help Animals Find Their Forever Homes"
|
|
description="Happy Paws has been rescuing, rehabilitating, and rehoming animals for over a decade. Our dedicated team works tirelessly to ensure every animal receives the care, love, and attention they deserve. We believe in second chances and the transformative power of pet companionship."
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
bulletPoints={[
|
|
{
|
|
title: "Expert Care",
|
|
description: "Veterinary professionals and trained staff provide compassionate care 24/7",
|
|
icon: Heart
|
|
},
|
|
{
|
|
title: "Safe Haven",
|
|
description: "Clean, comfortable facilities designed for animal wellbeing and happiness",
|
|
icon: Home
|
|
},
|
|
{
|
|
title: "Perfect Match",
|
|
description: "We carefully match each animal with families suited to their unique personalities",
|
|
icon: Users
|
|
},
|
|
{
|
|
title: "Lifetime Support",
|
|
description: "We remain available to our adopting families for any questions or concerns",
|
|
icon: Shield
|
|
}
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-playing-with-cute-dog-up-adoption_23-2148682991.jpg"
|
|
imageAlt="Professional shelter staff caring for rescued animals"
|
|
imagePosition="right"
|
|
mediaAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Our Mission", href: "https://example.com" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pets" data-section="pets">
|
|
<ProductCardFour
|
|
title="Meet Our Furry Friends Waiting for Adoption"
|
|
description="Each animal in our care is looking for a loving family. Browse our available pets and find your perfect companion."
|
|
tag="Available Now"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "1",
|
|
name: "Max",
|
|
variant: "Golden Retriever • 3 years",
|
|
price: "Adoption Fee: $150",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/happy-couple-guys-playing-with-their-dog-backyard-grass-cheerful-old-dog_158595-6547.jpg",
|
|
imageAlt: "Max, a friendly golden retriever"
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "Luna",
|
|
variant: "Tabby Cat • 2 years",
|
|
price: "Adoption Fee: $75",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/beautiful-woman-walking-out-her-dogs-field_1303-17273.jpg",
|
|
imageAlt: "Luna, a playful tabby kitten"
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Pepper",
|
|
variant: "Rabbit • 1 year",
|
|
price: "Adoption Fee: $50",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/side-view-women-playing-with-dog_23-2149481037.jpg",
|
|
imageAlt: "Pepper, a fluffy bunny"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="impact" data-section="impact">
|
|
<MetricCardSeven
|
|
title="Our Impact"
|
|
description="The numbers that showcase our commitment to animal welfare and community support."
|
|
tag="By The Numbers"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1",
|
|
value: "2,500+",
|
|
title: "Animals Rescued and Rehomed",
|
|
items: [
|
|
"Dogs, cats, rabbits, and more",
|
|
"Comprehensive veterinary care provided",
|
|
"Average adoption within 3 months"
|
|
]
|
|
},
|
|
{
|
|
id: "2",
|
|
value: "98%",
|
|
title: "Adoption Success Rate",
|
|
items: [
|
|
"Successful placements in loving homes",
|
|
"Lifetime follow-up support offered",
|
|
"Zero returns due to poor matching"
|
|
]
|
|
},
|
|
{
|
|
id: "3",
|
|
value: "15",
|
|
title: "Years of Service",
|
|
items: [
|
|
"Dedicated to animal rescue and care",
|
|
"Serving our local community",
|
|
"Growing impact each year"
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFifteen
|
|
testimonial="Happy Paws gave us our best friend. The staff was incredibly kind and helped us find the perfect match. We couldn't imagine our family without our rescue dog now!"
|
|
rating={5}
|
|
author="Sarah Johnson, Adopting Family"
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="slide-up"
|
|
useInvertedBackground={true}
|
|
avatars={[
|
|
{
|
|
src: "https://img.b2bpic.net/free-photo/close-up-attractive-african-american-woman-smiling-looking-happy-standing-yellow-background_1258-54850.jpg",
|
|
alt: "Happy adopter smiling"
|
|
},
|
|
{
|
|
src: "https://img.b2bpic.net/free-photo/portrait-ambitious-confident-adult-30s-woman-cross-arms-smiling-happy-front-looking-forward-standing-against-white-wall_176420-40694.jpg",
|
|
alt: "Family with rescue pet"
|
|
},
|
|
{
|
|
src: "https://img.b2bpic.net/free-photo/young-blonde-girl-smiling-happy-walking-city_839833-17519.jpg",
|
|
alt: "Children with adopted animal"
|
|
},
|
|
{
|
|
src: "https://img.b2bpic.net/free-photo/carefree-blond-girl-close-her-eyes-smiles-feels-happy-breathing-standing-green-dress-white-background_176420-48919.jpg",
|
|
alt: "Satisfied adopter portrait"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
sideTitle="Frequently Asked Questions"
|
|
sideDescription="Get answers to common questions about adoption, animal care, and our services."
|
|
textPosition="left"
|
|
useInvertedBackground={false}
|
|
faqsAnimation="slide-up"
|
|
faqs={[
|
|
{
|
|
id: "1",
|
|
title: "What is the adoption process?",
|
|
content: "Our adoption process is simple and thorough. You'll start by viewing available animals, complete an adoption application, meet with our staff to ensure a good match, and finalize paperwork. We typically process applications within 48 hours."
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Are adopted animals vaccinated and neutered?",
|
|
content: "Yes! All animals in our care receive comprehensive veterinary care including vaccinations, microchipping, and spaying or neutering before adoption. This ensures a healthy start for your new family member."
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "What if the adoption doesn't work out?",
|
|
content: "We stand behind every adoption. If for any reason the placement doesn't work out, we accept the animal back with no questions asked. Your satisfaction and the animal's wellbeing are our priorities."
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "How can I donate or volunteer?",
|
|
content: "We welcome donations and volunteers! You can donate through our website, or contact our volunteer coordinator to learn about volunteer opportunities including animal care, fundraising, and administrative support."
|
|
},
|
|
{
|
|
id: "5",
|
|
title: "Do you accept owner surrenders?",
|
|
content: "Yes, we compassionately accept animals from owners facing difficult circumstances. We assess each animal and provide appropriate care and rehoming services. Contact us to discuss your situation confidentially."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Ready to Help"
|
|
title="Start Your Adoption Journey Today"
|
|
description="Join thousands of happy families who found their perfect companion at Happy Paws. Sign up for updates about new arrivals and adoption events."
|
|
tagIcon={Heart}
|
|
background={{ variant: "rotated-rays-animated-grid" }}
|
|
useInvertedBackground={false}
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Get Updates"
|
|
termsText="We respect your privacy. Unsubscribe anytime. By signing up, you agree to receive updates about adoptions and shelter events."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Happy Paws"
|
|
leftLink={{
|
|
text: "Privacy Policy",
|
|
href: "https://example.com/privacy"
|
|
}}
|
|
rightLink={{
|
|
text: "Contact Us",
|
|
href: "contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |