221 lines
13 KiB
TypeScript
221 lines
13 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import { Heart, CheckCircle, Home, Users, Trophy, Star } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumSmall"
|
|
sizing="large"
|
|
background="radialGradient"
|
|
cardStyle="gradient-mesh"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="Pawsitive Haven"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Our Pets", id: "products" },
|
|
{ name: "Get Involved", id: "feature" },
|
|
{ name: "Impact", id: "about" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardRotatedCarousel
|
|
title="Find Your Perfect Companion"
|
|
description="Give a loving pet a second chance at happiness. Browse our amazing collection of adoptable dogs, cats, and other wonderful animals waiting for their forever homes."
|
|
tag="Adopt Today"
|
|
tagIcon={Heart}
|
|
buttons={[
|
|
{ text: "Start Adoption Journey", href: "#products" },
|
|
{ text: "Support Our Mission", href: "#contact" }
|
|
]}
|
|
carouselItems={[
|
|
{ id: "1", imageSrc: "https://img.b2bpic.net/free-photo/little-puppy-farm-is-enjoying-sunny-day_181624-40643.jpg", imageAlt: "Happy dog ready for adoption" },
|
|
{ id: "2", imageSrc: "https://img.b2bpic.net/free-photo/dog-sitting-near-girl_8353-5282.jpg", imageAlt: "Cute kitten looking for a home" },
|
|
{ id: "3", imageSrc: "https://img.b2bpic.net/free-photo/smiling-young-woman-cuddling-her-friendly-dog_23-2147840629.jpg", imageAlt: "Fluffy rabbit waiting for adoption" },
|
|
{ id: "4", imageSrc: "https://img.b2bpic.net/free-photo/happy-girl-embracing-her-dog_23-2147637103.jpg", imageAlt: "Dog playing happily" },
|
|
{ id: "5", imageSrc: "https://img.b2bpic.net/free-photo/hipster-woman-smile-enjoy-playing-with-her-puppy-summer-field-vintage-tone-filter_1150-1188.jpg", imageAlt: "Cat seeking loving home" },
|
|
{ id: "6", imageSrc: "https://img.b2bpic.net/free-photo/outdoors-lifestyle-portrait-beautiful-girl-enjoying-nature_613910-428.jpg", imageAlt: "Puppies ready for forever homes" }
|
|
]}
|
|
autoPlay={true}
|
|
autoPlayInterval={4000}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<AboutMetric
|
|
title="Transforming lives through compassionate animal rescue and adoption. Every pet deserves a loving family and a safe home."
|
|
metrics={[
|
|
{ icon: Heart, label: "Pets Adopted", value: "2,350+" },
|
|
{ icon: Home, label: "Happy Homes", value: "2,350" },
|
|
{ icon: Users, label: "Dedicated Volunteers", value: "180+" },
|
|
{ icon: Trophy, label: "Years of Service", value: "15" }
|
|
]}
|
|
useInvertedBackground="invertDefault"
|
|
/>
|
|
</div>
|
|
|
|
<div id="feature" data-section="feature">
|
|
<FeatureCardNine
|
|
title="How Adoption Works"
|
|
description="Our streamlined adoption process makes it easy to find and welcome your new family member into your home."
|
|
tag="Simple & Transparent"
|
|
tagIcon={CheckCircle}
|
|
buttons={[
|
|
{ text: "Learn More", href: "#products" }
|
|
]}
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Browse Profiles", description: "Explore detailed profiles of all our available pets with photos, personalities, and care requirements. Find the perfect match for your lifestyle and family.", phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-dog-with-phone_23-2149101699.jpg" },
|
|
phoneTwo: { imageSrc: "https://img.b2bpic.net/free-vector/charity-app-interface-screens_52683-43806.jpg" }
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Get Matched", description: "Our adoption counselors help ensure a perfect match between you and your future pet, considering lifestyle, energy levels, and compatibility.", phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-dog-with-phone_23-2149101699.jpg" },
|
|
phoneTwo: { imageSrc: "https://img.b2bpic.net/free-vector/charity-app-interface-screens_52683-43806.jpg" }
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Welcome Home", description: "Complete your adoption with ongoing support and guidance. We're here for you and your pet's successful adjustment and long-term happiness.", phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-dog-with-phone_23-2149101699.jpg" },
|
|
phoneTwo: { imageSrc: "https://img.b2bpic.net/free-vector/charity-app-interface-screens_52683-43806.jpg" }
|
|
}
|
|
]}
|
|
showStepNumbers={true}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardThirteen
|
|
title="Stories from Our Happy Families"
|
|
description="Real experiences from people who found their perfect companion at Pawsitive Haven."
|
|
tag="Adoption Success"
|
|
tagIcon={Star}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", handle: "@sarahj_loves_max", testimonial: "Adopting Max was the best decision ever! The staff at Pawsitive Haven made the whole process so easy and supportive. Max has brought so much joy to our family.", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/front-view-business-woman-suit_23-2148603018.jpg", imageAlt: "Sarah Johnson"
|
|
},
|
|
{
|
|
id: "2", name: "Michael Chen", handle: "@mike_and_luna", testimonial: "Luna was shy when we first met her, but the team helped us understand her needs. Now she's the most loving companion. Thank you for helping us find each other!", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg", imageAlt: "Michael Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Emily Rodriguez", handle: "@family_with_buddy", testimonial: "The adoption process was transparent and caring. Buddy fits perfectly into our family. The post-adoption support has been invaluable. Highly recommend!", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-smiling-pretty-girl-plaid-shirt-posing_114579-70643.jpg", imageAlt: "Emily Rodriguez"
|
|
},
|
|
{
|
|
id: "4", name: "David Kim", handle: "@david_and_milo", testimonial: "As a first-time pet owner, I was nervous about adoption. The team at Pawsitive Haven answered all my questions and helped me prepare. Milo is amazing!", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "David Kim"
|
|
},
|
|
{
|
|
id: "5", name: "Jessica Martinez", handle: "@jess_loves_whiskers", testimonial: "The shelter's commitment to animal welfare is evident in how well-cared-for the pets are. Whiskers is thriving and we couldn't be happier!", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/young-beautiful-woman-smiling-posing-purple-wall_176420-2852.jpg", imageAlt: "Jessica Martinez"
|
|
},
|
|
{
|
|
id: "6", name: "Robert Thompson", handle: "@bob_and_scout", testimonial: "Scout needed special attention due to past trauma. The team matched us perfectly and provided ongoing training support. She's now confident and happy!", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg", imageAlt: "Robert Thompson"
|
|
}
|
|
]}
|
|
showRating={true}
|
|
carouselMode="buttons"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="invertDefault"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
title="Meet Our Available Pets"
|
|
description="Each of these wonderful animals is waiting for a loving home. Learn about their unique personalities and find your perfect match."
|
|
tag="Ready to Adopt"
|
|
products={[
|
|
{
|
|
id: "1", name: "Max", price: "Adoption Fee $150", variant: "Golden Retriever • 3 years old", imageSrc: "https://img.b2bpic.net/free-photo/dog-stairs-with-adoption-banner_23-2148699705.jpg", imageAlt: "Max the Golden Retriever"
|
|
},
|
|
{
|
|
id: "2", name: "Whiskers", price: "Adoption Fee $75", variant: "Tabby Cat • 2 years old", imageSrc: "https://img.b2bpic.net/free-photo/direct-look-into-face-duck-tolling-retriever-dog_493961-1048.jpg", imageAlt: "Whiskers the Tabby Cat"
|
|
},
|
|
{
|
|
id: "3", name: "Buddy", price: "Adoption Fee $125", variant: "Beagle • 4 years old", imageSrc: "https://img.b2bpic.net/free-photo/happy-dog-family-background_329181-20460.jpg", imageAlt: "Buddy the Beagle"
|
|
},
|
|
{
|
|
id: "4", name: "Patches", price: "Adoption Fee $60", variant: "Rabbit • 1 year old", imageSrc: "https://img.b2bpic.net/free-photo/high-angle-woman-holding-cute-dog_23-2148415187.jpg", imageAlt: "Patches the Rabbit"
|
|
},
|
|
{
|
|
id: "5", name: "Scout", price: "Adoption Fee $150", variant: "German Shepherd • 5 years old", imageSrc: "https://img.b2bpic.net/free-photo/adorable-nova-scotia-duck-tolling-retriever-dog-resting-sunshine_493961-1035.jpg", imageAlt: "Scout the German Shepherd"
|
|
},
|
|
{
|
|
id: "6", name: "Luna", price: "Adoption Fee $75", variant: "Black Cat • 1 year old", imageSrc: "https://img.b2bpic.net/free-photo/smiley-woman-playing-with-dog-shelter_23-2148682979.jpg", imageAlt: "Luna the Black Cat"
|
|
}
|
|
]}
|
|
carouselMode="buttons"
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{ text: "View All Pets", href: "#" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Adopt", items: [
|
|
{ label: "Available Pets", href: "#products" },
|
|
{ label: "How to Adopt", href: "#feature" },
|
|
{ label: "Adoption FAQ", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Donate", href: "#" },
|
|
{ label: "Volunteer", href: "#" },
|
|
{ label: "Sponsor a Pet", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "About", items: [
|
|
{ label: "Our Mission", href: "#about" },
|
|
{ label: "Contact Us", href: "#" },
|
|
{ label: "Success Stories", href: "#testimonial" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
bottomLeftText="© 2025 Pawsitive Haven. All rights reserved."
|
|
bottomRightText="Made with love for animals"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |