Files
67164aea-6fcc-4dc4-a19a-09c…/src/app/page.tsx
2026-01-22 17:12:56 +00:00

276 lines
14 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import SplitAbout from '@/components/sections/about/SplitAbout';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricCardTen from '@/components/sections/metrics/MetricCardTen';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Heart, Home, Users, Hand, Gift } from "lucide-react";
export default function PetShelterPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="mediumLarge"
sizing="medium"
background="none"
cardStyle="elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarStyleApple
brandName="Happy Paws Shelter"
navItems={[
{ name: "About", id: "about" },
{ name: "Our Pets", id: "pets" },
{ name: "How to Adopt", id: "adoption" },
{ name: "Get Involved", id: "involved" },
{ name: "Contact", id: "contact" }
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroLogoBillboardSplit
logoText="Happy Paws"
description="Give a loving home to a pet in need. Discover your perfect companion at our shelter and make a difference in an animal's life today."
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Browse Pets", href: "#pets" },
{ text: "Learn More", href: "#about" }
]}
layoutOrder="default"
imageSrc="https://img.b2bpic.net/free-photo/woman-playing-with-rescue-dogs-shelter_23-2148682984.jpg"
imageAlt="Happy dogs and cats at the shelter"
frameStyle="card"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
title="About Happy Paws Shelter"
description="For over 20 years, Happy Paws Shelter has been dedicated to rescuing, rehabilitating, and rehoming animals in need. Our mission is to provide a safe haven for abandoned and mistreated pets while connecting them with loving families."
tag="Our Story"
textboxLayout="default"
useInvertedBackground="noInvert"
bulletPoints={[
{
title: "Expert Care", description: "Our veterinary team provides comprehensive health care and behavioral support for every animal.", icon: Heart
},
{
title: "Safe Haven", description: "A comfortable, clean environment where animals can heal and prepare for their new homes.", icon: Home
},
{
title: "Community Focused", description: "We believe in building lasting relationships between pets, adopters, and our community.", icon: Users
}
]}
imageSrc="https://img.b2bpic.net/free-photo/dogs-locked-up-victims-animal-abuse-abuse_181624-57149.jpg"
imageAlt="Caring team members helping animals at the shelter"
imagePosition="right"
buttons={[
{ text: "Our Mission", href: "#involved" }
]}
/>
</div>
<div id="pets" data-section="pets">
<ProductCardOne
title="Pets Waiting for You"
description="Meet some of the wonderful animals currently available for adoption. Each pet is fully vetted, vaccinated, and ready to find their forever home."
tag="Available Now"
textboxLayout="default"
useInvertedBackground="noInvert"
products={[
{
id: "1", name: "Max", price: "Adoption $150", imageSrc: "https://img.b2bpic.net/free-photo/happy-pet-dogs-playing-park_1359-280.jpg", imageAlt: "Golden Retriever named Max"
},
{
id: "2", name: "Whiskers", price: "Adoption $50", imageSrc: "https://img.b2bpic.net/free-photo/local-labrador-beige-puppy-chilling-grass-looking-camera-with-sad-droopy-eyes_1268-20171.jpg", imageAlt: "Orange tabby cat named Whiskers"
},
{
id: "3", name: "Shadow", price: "Adoption $120", imageSrc: "https://img.b2bpic.net/free-photo/cute-golden-retriever-puppy-resting-couch_181624-26198.jpg", imageAlt: "Black and white dog named Shadow"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTen
title="Our Impact"
description="The real numbers behind our mission to save and rehome animals."
tag="Since 2004"
textboxLayout="default"
useInvertedBackground="noInvert"
metrics={[
{
id: "1", title: "Animals Rescued", subtitle: "Over the past 20 years", category: "Rescues", value: "4,500+"
},
{
id: "2", title: "Successful Adoptions", subtitle: "Homes found for beloved pets", category: "Adoptions", value: "4,200+"
},
{
id: "3", title: "Veterinary Procedures", subtitle: "Treatments and surgeries completed", category: "Healthcare", value: "8,750+"
},
{
id: "4", title: "Community Volunteers", subtitle: "Dedicated helpers annually", category: "Team", value: "240+"
}
]}
animationType="slide-up"
carouselMode="buttons"
/>
</div>
<div id="adoption" data-section="adoption">
<FeatureCardOne
title="How to Adopt"
description="Our adoption process is simple, transparent, and designed to ensure the best match between pets and families."
tag="Step by Step"
textboxLayout="default"
useInvertedBackground="noInvert"
features={[
{
title: "Browse & Select", description: "Browse our available pets online or visit us in person. Take your time finding the perfect match for your home.", imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg"
},
{
title: "Application", description: "Complete a simple adoption application to help us learn about your living situation and lifestyle.", imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg"
},
{
title: "Meet & Greet", description: "Spend time with your chosen pet to ensure compatibility and answer any questions you might have.", imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg"
},
{
title: "Home Sweet Home", description: "Complete the final paperwork and adoption fee, then take your new family member home with love and support.", imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
title="Success Stories"
description="Real families, real love. Read how these adopters found their perfect companion."
tag="Happy Endings"
textboxLayout="default"
useInvertedBackground="noInvert"
testimonials={[
{
id: "1", name: "Sarah Martinez", role: "Dog Lover", company: "Max's New Family", rating: 5,
imageSrc: "https://img.b2bpic.net/free-photo/smiley-boy-parents-petting-dog-while-park_23-2148647749.jpg", imageAlt: "Sarah with her adopted dog Max"
},
{
id: "2", name: "The Johnson Family", role: "First-Time Pet Parents", company: "Whiskers' New Home", rating: 5,
imageSrc: "https://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg", imageAlt: "The Johnson family with their adopted cat"
},
{
id: "3", name: "Robert Chen", role: "Senior Pet Owner", company: "Companion Care", rating: 5,
imageSrc: "https://img.b2bpic.net/free-photo/meidum-shot-man-woman-with-cute-dog_23-2149027306.jpg", imageAlt: "Robert enjoying time with his adopted dog"
},
{
id: "4", name: "Emma Williams", role: "Young Professional", company: "Shadow's Forever Home", rating: 5,
imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-family-dog_329181-20491.jpg", imageAlt: "Emma with her adopted dog Shadow"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
/>
</div>
<div id="involved" data-section="involved">
<SplitAbout
title="Get Involved"
description="Whether you adopt, volunteer, or donate, you can make a difference in an animal's life. Join our community of animal lovers and help us continue our mission."
tag="Make a Difference"
textboxLayout="default"
useInvertedBackground="noInvert"
bulletPoints={[
{
title: "Adopt", description: "Give a loving home to a pet in need and experience the joy of animal companionship.", icon: Heart
},
{
title: "Volunteer", description: "Help care for animals, assist with events, or support our administrative operations.", icon: Hand
},
{
title: "Donate", description: "Your contributions support veterinary care, food, shelter, and rehabilitation programs.", icon: Gift
}
]}
imageSrc="https://img.b2bpic.net/free-photo/smiley-woman-spending-time-with-cute-rescue-dogs-shelter_23-2148682966.jpg"
imageAlt="Volunteers helping animals at the shelter"
imagePosition="left"
buttons={[
{ text: "Volunteer With Us", href: "#contact" },
{ text: "Donate", href: "#contact" }
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
title="Get In Touch"
description="Have questions about adoption, volunteering, or want to learn more about Happy Paws Shelter? We'd love to hear from you. Reach out today!"
useInvertedBackground="noInvert"
inputs={[
{ name: "name", type: "text", placeholder: "Your Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email", required: true },
{ name: "phone", type: "tel", placeholder: "Phone Number", required: false },
{ name: "inquiry_type", type: "text", placeholder: "Adoption, Volunteer, or Donation", required: true }
]}
textarea={{
name: "message", placeholder: "Tell us more about how you'd like to help...", rows: 5,
required: true
}}
buttonText="Send Message"
mediaPosition="right"
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "About", items: [
{ label: "Our Story", href: "#about" },
{ label: "Mission & Values", href: "#about" },
{ label: "Team", href: "#involved" }
]
},
{
title: "Adopt", items: [
{ label: "Available Pets", href: "#pets" },
{ label: "How to Adopt", href: "#adoption" },
{ label: "Success Stories", href: "#testimonials" }
]
},
{
title: "Support", items: [
{ label: "Volunteer", href: "#involved" },
{ label: "Donate", href: "#involved" },
{ label: "Contact Us", href: "#contact" }
]
},
{
title: "Resources", items: [
{ label: "Pet Care Tips", href: "#" },
{ label: "FAQ", href: "#" },
{ label: "Blog", href: "#" }
]
}
]}
bottomLeftText="© 2025 Happy Paws Shelter. All rights reserved."
bottomRightText="Saving lives, one pet at a time."
/>
</div>
</ThemeProvider>
);
}