127 lines
6.1 KiB
TypeScript
127 lines
6.1 KiB
TypeScript
"use client";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
|
|
import { Home, HeartHandshake, Stethoscope, Users } from "lucide-react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import Link from "next/link";
|
|
|
|
export default function AdoptPage() {
|
|
const navItems = [
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Adopt", id: "/adopt" },
|
|
{ name: "About", id: "/about" },
|
|
{ name: "Contact", id: "/contact" },
|
|
{ name: "Donate", id: "/donate" },
|
|
{ name: "Shop", id: "/shop" },
|
|
{ name: "Blog", id: "/blog" }
|
|
];
|
|
|
|
const navButton = { text: "Donate", href: "/donate" };
|
|
|
|
const footerColumns = [
|
|
{
|
|
title: "About Us", items: [
|
|
{ label: "Our Mission", href: "/about" },
|
|
{ label: "Meet the Team", href: "/about" },
|
|
{ label: "Impact Report", href: "/about" }
|
|
]
|
|
},
|
|
{
|
|
title: "Get Involved", items: [
|
|
{ label: "Adopt a Pet", href: "/adopt" },
|
|
{ label: "Volunteer", href: "/contact" },
|
|
{ label: "Foster a Pet", href: "/contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{ label: "FAQs", href: "/contact" },
|
|
{ label: "Pet Care Tips", href: "/" },
|
|
{ label: "Contact Us", href: "/contact" }
|
|
]
|
|
}
|
|
];
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant={"hover-bubble"}
|
|
defaultTextAnimation={"background-highlight"}
|
|
borderRadius={"sharp"}
|
|
contentWidth={"mediumSmall"}
|
|
sizing={"largeSmall"}
|
|
background={"aurora"}
|
|
cardStyle={"subtle-shadow"}
|
|
primaryButtonStyle={"inset-glow"}
|
|
secondaryButtonStyle={"solid"}
|
|
headingFontWeight={"light"}
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered navItems={navItems} button={navButton} brandName="Hope Haven" className="py-4" />
|
|
</div>
|
|
|
|
<div id="adoptable-pets" data-section="adoptable-pets">
|
|
<ProductCardTwo
|
|
title="Meet Our Adoptable Pets"
|
|
description="These wonderful animals are looking for their forever homes. Browse our current residents and find your perfect companion."
|
|
products={[
|
|
{ id: "dog-1", brand: "Hope Haven", name: "Buddy the Golden Retriever", price: "Adoption Fee: $350", rating: 5, reviewCount: "25 reviews", imageSrc: "https://img.b2bpic.net/free-photo/female-dog-owner-walking-with-french-bulldog-park_7502-8277.jpg", imageAlt: "Buddy, a friendly Golden Retriever" },
|
|
{ id: "cat-1", brand: "Hope Haven", name: "Luna the Tabby Cat", price: "Adoption Fee: $200", rating: 4, reviewCount: "18 reviews", imageSrc: "https://img.b2bpic.net/free-photo/woman-brown-sweater-lady-with-labrador_1157-42396.jpg", imageAlt: "Luna, a playful Tabby Cat" },
|
|
{ id: "dog-2", brand: "Hope Haven", name: "Max the Beagle", price: "Adoption Fee: $300", rating: 5, reviewCount: "32 reviews", imageSrc: "https://img.b2bpic.net/free-photo/happy-african-american-sportswoman-cuddling-her-small-dog-while-being-nature_637285-4485.jpg", imageAlt: "Max, an energetic Beagle" },
|
|
{ id: "cat-2", brand: "Hope Haven", name: "Cleo the Siamese", price: "Adoption Fee: $250", rating: 4, reviewCount: "12 reviews", imageSrc: "https://img.b2bpic.net/free-photo/cute-black-hamilton-hound-dog-playing-park-sunny-day_181624-42680.jpg", imageAlt: "Cleo, an elegant Siamese cat" }
|
|
]}
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Adopt Now"
|
|
textBoxTitleClassName="font-light"
|
|
textBoxDescriptionClassName="font-light"
|
|
cardBrandClassName="font-light"
|
|
cardNameClassName="font-light"
|
|
cardPriceClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-adopt" data-section="why-adopt">
|
|
<FeatureHoverPattern
|
|
title="Why Adopt from Hope Haven?"
|
|
description="Discover the unique benefits and comprehensive support you receive when you adopt from our shelter."
|
|
features={[
|
|
{ icon: Home, title: "A Loving Home Awaits", description: "Provide a deserving animal with a warm, safe, and permanent home. You change a life forever." },
|
|
{ icon: HeartHandshake, title: "Comprehensive Support", description: "We offer post-adoption resources, training tips, and a community network to ensure a smooth transition for you and your new pet." },
|
|
{ icon: Stethoscope, title: "Healthy & Happy Pets", description: "All our animals receive thorough veterinary check-ups, vaccinations, and spay/neuter services before adoption." },
|
|
{ icon: Users, title: "Matching Perfect Pairs", description: "Our experienced team helps you find the ideal companion whose personality and needs align with your lifestyle." }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Our Promise"
|
|
textBoxTitleClassName="font-light"
|
|
textBoxDescriptionClassName="font-light"
|
|
cardTitleClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<div id="get-involved" data-section="get-involved">
|
|
<ContactText
|
|
text="Ready to open your home? Start your adoption journey with Hope Haven today."
|
|
animationType="background-highlight"
|
|
buttons={[{ text: "View All Pets", href: "/adopt" }, { text: "Contact Us", href: "/contact" }]}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
ariaLabel="Call to action for adoption"
|
|
textClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<FooterBase
|
|
columns={footerColumns}
|
|
logoText="Hope Haven"
|
|
copyrightText="© 2024 Hope Haven Animal Shelter. All rights reserved."
|
|
/>
|
|
</ThemeProvider>
|
|
);
|
|
} |