246 lines
14 KiB
TypeScript
246 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
|
|
import TextAbout from "@/components/sections/about/TextAbout";
|
|
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
|
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
|
|
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
|
|
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
|
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
|
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
|
import { CheckCircle, Handshake, Heart, Share2, Sparkles, Users } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="fluid"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="Paws & Care"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Pets", id: "featured-pets" },
|
|
{ name: "Adopt", id: "adopt" },
|
|
{ name: "Support", id: "support" },
|
|
{ name: "FAQ", id: "faq" },
|
|
]}
|
|
button={{ text: "Adopt Now", href: "#featured-pets" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
title="Give a Loving Pet a Forever Home"
|
|
description="Meet our adorable animals waiting for their perfect family. Every adoption saves lives and opens homes to joy, companionship, and unconditional love."
|
|
tag="Adopt Today"
|
|
tagIcon={Heart}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "sparkles-gradient" }}
|
|
buttons={[
|
|
{ text: "Browse Pets", href: "#featured-pets" },
|
|
{ text: "Learn More", href: "#about" },
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
imageSrc="http://img.b2bpic.net/free-photo/woman-interacting-with-rescue-dogs-shelter_23-2148682952.jpg"
|
|
imageAlt="Happy pets at our shelter"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
tag="Our Mission"
|
|
tagIcon={Heart}
|
|
title="Dedicated to Rescuing, Caring For, and Finding Forever Homes for Abandoned and Neglected Animals"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Support Our Mission", href: "#support" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="featured-pets" data-section="featured-pets">
|
|
<ProductCardOne
|
|
title="Meet Our Adorable Residents"
|
|
description="Each of these wonderful animals is waiting to join your family. Click to learn more about their personalities and adoption requirements."
|
|
tag="Available Now"
|
|
tagIcon={Sparkles}
|
|
products={[
|
|
{
|
|
id: "1", name: "Max - Golden Retriever", price: "Adoption Fee: $150", imageSrc: "http://img.b2bpic.net/free-photo/what-good-boy-beautiful-golden-labrador-with-leash-sitting-with-his-owners-park_496169-2472.jpg", imageAlt: "Max the Golden Retriever"},
|
|
{
|
|
id: "2", name: "Luna - Tabby Cat", price: "Adoption Fee: $75", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-holding-tabby-cat_23-2148045665.jpg", imageAlt: "Luna the Tabby Cat"},
|
|
{
|
|
id: "3", name: "Charlie - Puppy", price: "Adoption Fee: $120", imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-adorable-german-shepherd-puppy-with-chew-toy_181624-26888.jpg", imageAlt: "Charlie the Puppy"},
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "View All Pets", href: "#" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="adopt" data-section="adopt">
|
|
<FeatureCardTwentySeven
|
|
title="How to Adopt"
|
|
description="Our adoption process is simple and transparent. We ensure every pet finds the right home where they'll be loved and cared for."
|
|
tag="Simple Steps"
|
|
tagIcon={CheckCircle}
|
|
features={[
|
|
{
|
|
id: "1", title: "Browse & Meet", description: "Explore our available pets online or visit us in person. Spend time with the animals to find your perfect match.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=1", imageAlt: "Browse pets"},
|
|
{
|
|
id: "2", title: "Application", description: "Complete our adoption application. We ask a few questions to ensure a good fit between you and your new pet.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=2", imageAlt: "Application process"},
|
|
{
|
|
id: "3", title: "Home Visit", description: "Our team may schedule a quick home visit to ensure a safe environment for your new companion.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=3", imageAlt: "Home visit"},
|
|
{
|
|
id: "4", title: "Welcome Home", description: "Complete the adoption paperwork and take your new family member home to start your wonderful journey together.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=4", imageAlt: "Happy adoption"},
|
|
]}
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Start Adoption", href: "#" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
title="Success Stories"
|
|
description="Hear from families whose lives have been transformed by our rescue animals. Every adoption is a love story waiting to happen."
|
|
tag="Happy Homes"
|
|
tagIcon={Heart}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", role: "Pet Parent", company: "New York", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-with-her-dog-park_23-2147902250.jpg", imageAlt: "Sarah with her dog"},
|
|
{
|
|
id: "2", name: "Michael Chen", role: "Cat Lover", company: "California", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/brunette-man-looking-his-cat-embracing-wife-indoor-portrait-happy-family-posing-with-pet_197531-12215.jpg", imageAlt: "Michael with his cat"},
|
|
{
|
|
id: "3", name: "Emily Rodriguez", role: "Dog Rescuer", company: "Texas", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/teenage-girl-her-dog-making-selfie_329181-20369.jpg", imageAlt: "Emily with her rescue dog"},
|
|
{
|
|
id: "4", name: "David & Lisa Kim", role: "Family", company: "Seattle", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-walking-their-french-bulldogs-park_1303-17965.jpg", imageAlt: "David and Lisa with their pet"},
|
|
]}
|
|
kpiItems={[
|
|
{ value: "500+", label: "Pets Adopted This Year" },
|
|
{ value: "2,000+", label: "Happy Families" },
|
|
{ value: "15+", label: "Years Saving Lives" },
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="support" data-section="support">
|
|
<MetricCardThree
|
|
title="How You Can Help"
|
|
description="There are many ways to support our mission of caring for animals in need. Join our community of heroes."
|
|
tag="Make a Difference"
|
|
tagIcon={Handshake}
|
|
metrics={[
|
|
{ id: "1", icon: Heart, title: "Donate", value: "Every $5 Helps" },
|
|
{ id: "2", icon: Users, title: "Volunteer", value: "Give Your Time" },
|
|
{ id: "3", icon: Share2, title: "Share", value: "Spread the Word" },
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[
|
|
{ text: "Donate Now", href: "#" },
|
|
{ text: "Volunteer", href: "#" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
sideTitle="Frequently Asked Questions"
|
|
sideDescription="Find answers to common questions about adoption, our facilities, and how to support our mission."
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What is your adoption process?", content: "Our adoption process includes browsing available pets, completing an application, a potential home visit, and finalizing paperwork. The entire process typically takes 3-7 business days."},
|
|
{
|
|
id: "2", title: "What are the adoption fees?", content: "Adoption fees vary based on the animal's age and health status, typically ranging from $50-$200. Fees help cover vaccinations, spaying/neutering, and initial medical care."},
|
|
{
|
|
id: "3", title: "Can I volunteer at the shelter?", content: "Yes! We welcome volunteers. Visit our facility or contact us to learn about available volunteer positions in animal care, adoption support, and administrative roles."},
|
|
{
|
|
id: "4", title: "Do you accept donations?", content: "Absolutely. We accept monetary donations, pet supplies, and in-kind contributions. Every donation directly helps us care for our animals and find them loving homes."},
|
|
{
|
|
id: "5", title: "What animals do you have available?", content: "We rescue and care for dogs, cats, and small animals including rabbits and guinea pigs. Our available animals are listed on our website with full profiles and photos."},
|
|
{
|
|
id: "6", title: "Are your animals vaccinated and neutered?", content: "Yes, all adopted animals are vaccinated, spayed/neutered, and microchipped. We provide complete medical records with each adoption."},
|
|
]}
|
|
textPosition="left"
|
|
useInvertedBackground={false}
|
|
animationType="smooth"
|
|
faqsAnimation="slide-up"
|
|
buttons={[{ text: "Contact Us", href: "#" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
tag="Ready to Help?"
|
|
tagIcon={Heart}
|
|
title="Transform a Life Today"
|
|
description="Whether you're looking to adopt, volunteer, or donate, your involvement makes a real difference in the lives of animals in need. Join our community of animal lovers and help us continue our mission."
|
|
background={{ variant: "radial-gradient" }}
|
|
buttons={[
|
|
{ text: "Adopt a Pet", href: "#featured-pets" },
|
|
{ text: "Get Involved", href: "#support" },
|
|
]}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Navigate", items: [
|
|
{ label: "Home", href: "#" },
|
|
{ label: "Available Pets", href: "#featured-pets" },
|
|
{ label: "Adoption", href: "#adopt" },
|
|
{ label: "About Us", href: "#about" },
|
|
],
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Donate", href: "#" },
|
|
{ label: "Volunteer", href: "#" },
|
|
{ label: "Sponsorship", href: "#" },
|
|
{ label: "Contact Us", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Adoption Policy", href: "#" },
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2025 Paws & Care Pet Shelter. All rights reserved."
|
|
bottomRightText="Saving Lives, Building Families"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|