Files
07e1ff86-33e7-4023-befa-dc0…/src/App.tsx
2026-04-21 12:07:14 +00:00

297 lines
9.6 KiB
TypeScript

import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSimple from '@/components/sections/faq/FaqSimple';
import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
import FooterSimpleMedia from '@/components/sections/footer/FooterSimpleMedia';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarCentered from '@/components/ui/NavbarCentered';
import ProductQuantityCards from '@/components/sections/product/ProductQuantityCards';
import SocialProofMarquee from '@/components/sections/social-proof/SocialProofMarquee';
import TestimonialMetricsCards from '@/components/sections/testimonial/TestimonialMetricsCards';
export default function App() {
return (
<>
<div id="nav" data-section="nav">
<NavbarCentered
logo="Paws & Hope"
navItems={[
{
name: "Adopt",
href: "#pets",
},
{
name: "About",
href: "#about",
},
{
name: "Process",
href: "#process",
},
{
name: "Contact",
href: "#contact",
},
]}
ctaButton={{
text: "Donate",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
tag="Rescue & Love"
title="Give a Forever Home to a Loyal Friend"
description="Every pet deserves a second chance. Discover your new best friend today and make a lasting impact in an animal's life."
primaryButton={{
text: "Meet Our Pets",
href: "#pets",
}}
secondaryButton={{
text: "Learn How to Help",
href: "#about",
}}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-girl-with-cute-dog-bench_23-2148699660.jpg?_wi=1"
/>
</div>
<div id="about" data-section="about">
<AboutMediaOverlay
tag="Our Mission"
title="Compassionate Care for Every Animal"
description="We are a community-focused shelter dedicated to the rescue, rehabilitation, and rehoming of homeless pets. Our goal is to provide a safe haven where animals feel loved while they wait for their forever families."
imageSrc="http://img.b2bpic.net/free-photo/dog-blue-beanbag_1321-3326.jpg"
/>
</div>
<div id="pets" data-section="pets">
<ProductQuantityCards
tag="Available Now"
title="Meet Our Adoptable Friends"
description="From playful puppies to serene seniors, our shelter is full of wonderful companions waiting to meet you."
products={[
{
name: "Luna",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/akita-dog-with-thick-brindle-fur-coat_493961-1550.jpg",
},
{
name: "Max",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/local-turkish-stray-cat-with-blind-one-eye-looks-sadly-camera_1268-20214.jpg",
},
{
name: "Bella",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-american-staffordshire-terrier_181624-24591.jpg",
},
{
name: "Charlie",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-angry-cat-wooden-surface_181624-41837.jpg",
},
{
name: "Daisy",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-with-her-beautiful-dog_1157-36168.jpg",
},
{
name: "Cooper",
price: "Adoption Ready",
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-cute-husky-with-blue-eyes-outdoors_181624-58743.jpg",
},
]}
/>
</div>
<div id="process" data-section="process">
<FeaturesDetailedSteps
tag="Getting Started"
title="The Adoption Journey"
description="We make the process simple, safe, and transparent so you and your new pet can start your journey together comfortably."
steps={[
{
tag: "01",
title: "Application",
subtitle: "Initial assessment",
description: "Fill out our easy online application to help us match you with your perfect pet.",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-business-coach-has-informal-meeting-with-trainee_273609-28642.jpg",
},
{
tag: "02",
title: "Meet & Greet",
subtitle: "Connection time",
description: "Spend time with your potential new family member to see if you have that perfect connection.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-women-dog-indoors_23-2148977481.jpg",
},
{
tag: "03",
title: "Welcome Home",
subtitle: "The big day",
description: "Once approved, take your new companion home to start a lifetime of memories together.",
imageSrc: "http://img.b2bpic.net/free-photo/person-traveling-with-their-pet-carrier_52683-109271.jpg",
},
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialMetricsCards
tag="Success Stories"
title="Happily Ever After"
description="Hear from some of the wonderful families who have adopted their best friends through our shelter."
testimonials={[
{
name: "Alice Smith",
role: "Adopter",
company: "Happy Home",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-with-her-dog_23-2148351269.jpg",
},
{
name: "Bob Jones",
role: "Adopter",
company: "Paws Family",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-looking-her-tabby-cat-park_23-2148045836.jpg",
},
{
name: "Charlie Brown",
role: "Adopter",
company: "Best Friend",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pet-cat-lifestyle-portraits_23-2149169904.jpg",
},
{
name: "Diana Ross",
role: "Adopter",
company: "Pet Lovers",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/parents-child-spending-time-together-with-dog-park_23-2148647773.jpg",
},
{
name: "Edward White",
role: "Adopter",
company: "Joyful Paws",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-adopt-me-sign-rescue-dog_23-2148682944.jpg",
},
]}
metrics={[
{
value: "500+",
label: "Pets Adopted",
},
{
value: "100%",
label: "Community Vetted",
},
{
value: "15",
label: "Years Active",
},
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSimple
tag="Helpful Info"
title="Common Questions"
description="Find answers to the most frequently asked questions regarding the adoption process and shelter services."
items={[
{
question: "What is included in the adoption fee?",
answer: "The fee covers vaccinations, microchipping, and spay/neuter services.",
},
{
question: "Can I return a pet if it doesn't work out?",
answer: "We encourage a thorough match process to avoid this, but we are always here to support our animals.",
},
{
question: "How can I volunteer?",
answer: "Check our volunteer page or visit us during operating hours to get started.",
},
]}
/>
</div>
<div id="social" data-section="social">
<SocialProofMarquee
tag="Community Partners"
title="Supporting Our Cause"
description="Local organizations and businesses that help us provide care to those in need."
names={[
"Local Vet Care",
"City Pet Supplies",
"Happy Dog Training",
"The Pet Groomer",
"Green Meadow Kennels",
"Pawsitive Vibes Cafe",
"Urban Pets Shop",
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Connect With Us"
title="Ready to Make a Difference?"
description="Whether you're looking to adopt, volunteer, or donate, we'd love to hear from you."
inputPlaceholder="Enter your email address"
buttonText="Send Message"
termsText="By submitting, you agree to our privacy policy and shelter guidelines."
/>
</div>
<div id="footer" data-section="footer">
<FooterSimpleMedia
brand="Paws & Hope"
columns={[
{
title: "About",
items: [
{
label: "Our Mission",
href: "#about",
},
{
label: "Adoption Process",
href: "#process",
},
],
},
{
title: "Get Involved",
items: [
{
label: "Donate",
href: "#contact",
},
{
label: "Volunteer",
href: "#contact",
},
],
},
]}
copyright="© 2024 Paws & Hope Shelter. All rights reserved."
links={[
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-girl-with-cute-dog-bench_23-2148699660.jpg?_wi=2"
/>
</div>
</>
);
}