Merge version_1_1777020846191 into main #1
398
src/App.tsx
398
src/App.tsx
@@ -13,298 +13,130 @@ import { Heart, Home, Shield } from "lucide-react";
|
||||
export default function App() {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Paws & Hope"
|
||||
navItems={[
|
||||
{
|
||||
name: "Adopt",
|
||||
href: "#adopt",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
ctaButton={{
|
||||
text: "Donate Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarCentered
|
||||
logo="Paws & Hope"
|
||||
navItems={[
|
||||
{ name: "Adopt", href: "#adopt" },
|
||||
{ name: "About", href: "#about" },
|
||||
{ name: "FAQ", href: "#faq" },
|
||||
{ name: "Contact", href: "#contact" },
|
||||
]}
|
||||
ctaButton={{ text: "Donate Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCenteredLogos
|
||||
tag="Find Your Best Friend"
|
||||
title="Give a Second Chance to a Loving Pet"
|
||||
description="Every animal deserves a home. Explore our available pets ready to become your newest family member and change your life forever."
|
||||
primaryButton={{
|
||||
text: "Start Adoption",
|
||||
href: "#adopt",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Donate Now",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCenteredLogos
|
||||
tag="Find Your Best Friend"
|
||||
title="Give a Second Chance to a Loving Pet"
|
||||
description="Every animal deserves a home. Explore our available pets ready to become your newest family member and change your life forever."
|
||||
primaryButton={{ text: "Start Adoption", href: "#adopt" }}
|
||||
secondaryButton={{ text: "Donate Now", href: "#contact" }}
|
||||
logos={[]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="How We Help"
|
||||
title="A Community Dedicated to Animal Welfare"
|
||||
description="We don't just provide shelter; we ensure every pet gets the care, love, and medical attention they deserve while waiting for their forever families."
|
||||
items={[
|
||||
{
|
||||
title: "Medical Care",
|
||||
descriptions: [
|
||||
"Full vaccinations",
|
||||
"Spaying and neutering",
|
||||
"Emergency health checks",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-plays-with-domestic-rabbit-street-pet-concept_169016-58914.jpg",
|
||||
},
|
||||
{
|
||||
title: "Pet Adoption",
|
||||
descriptions: [
|
||||
"Careful screening",
|
||||
"Behavior assessments",
|
||||
"Life-long support",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=k7pqdm",
|
||||
},
|
||||
{
|
||||
title: "Foster Network",
|
||||
descriptions: [
|
||||
"Temporary loving homes",
|
||||
"Extra socialization",
|
||||
"Healing environments",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-cat-outline-illustration_23-2149264418.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeaturesFlipCards
|
||||
tag="How We Help"
|
||||
title="A Community Dedicated to Animal Welfare"
|
||||
description="We don't just provide shelter; we ensure every pet gets the care, love, and medical attention they deserve while waiting for their forever families."
|
||||
items={[
|
||||
{ title: "Medical Care", descriptions: ["Full vaccinations", "Spaying and neutering", "Emergency health checks"], imageSrc: "http://img.b2bpic.net/free-photo/girl-plays-with-domestic-rabbit-street-pet-concept_169016-58914.jpg" },
|
||||
{ title: "Pet Adoption", descriptions: ["Careful screening", "Behavior assessments", "Life-long support"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=k7pqdm" },
|
||||
{ title: "Foster Network", descriptions: ["Temporary loving homes", "Extra socialization", "Healing environments"], imageSrc: "http://img.b2bpic.net/free-vector/flat-design-cat-outline-illustration_23-2149264418.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="adopt" data-section="adopt">
|
||||
<ProductRatingCards
|
||||
tag="Meet Our Pets"
|
||||
title="Ready for Adoption"
|
||||
description="Browse our currently available residents who are looking for someone to share their life with."
|
||||
products={[
|
||||
{
|
||||
brand: "Dog",
|
||||
name: "Buddy",
|
||||
price: "Adopted",
|
||||
rating: 5,
|
||||
reviewCount: "3 yrs",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-adorable-dog-shelter_23-2148682978.jpg",
|
||||
},
|
||||
{
|
||||
brand: "Cat",
|
||||
name: "Luna",
|
||||
price: "Adopted",
|
||||
rating: 5,
|
||||
reviewCount: "2 yrs",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/homeless-cat-looking-through-metallic-hence_114579-12034.jpg",
|
||||
},
|
||||
{
|
||||
brand: "Dog",
|
||||
name: "Max",
|
||||
price: "Adopted",
|
||||
rating: 4,
|
||||
reviewCount: "4 yrs",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-young-girl-holding-dog_23-2148316323.jpg",
|
||||
},
|
||||
{
|
||||
brand: "Cat",
|
||||
name: "Mittens",
|
||||
price: "Adopted",
|
||||
rating: 5,
|
||||
reviewCount: "1 yr",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-cat-with-green-eyes-looking-camera-street_181624-55165.jpg",
|
||||
},
|
||||
{
|
||||
brand: "Dog",
|
||||
name: "Daisy",
|
||||
price: "Adopted",
|
||||
rating: 5,
|
||||
reviewCount: "5 yrs",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/adorable-chihuahua-dog-outside-walk_23-2149880125.jpg",
|
||||
},
|
||||
{
|
||||
brand: "Cat",
|
||||
name: "Oliver",
|
||||
price: "Adopted",
|
||||
rating: 4,
|
||||
reviewCount: "6 mos",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-person-holding-adorable-tiny-kitten_181624-21695.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="adopt" data-section="adopt">
|
||||
<ProductRatingCards
|
||||
tag="Meet Our Pets"
|
||||
title="Ready for Adoption"
|
||||
description="Browse our currently available residents who are looking for someone to share their life with."
|
||||
products={[
|
||||
{ brand: "Dog", name: "Buddy", price: "Adopted", rating: 5, reviewCount: "3 yrs", imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-adorable-dog-shelter_23-2148682978.jpg" },
|
||||
{ brand: "Cat", name: "Luna", price: "Adopted", rating: 5, reviewCount: "2 yrs", imageSrc: "http://img.b2bpic.net/free-photo/homeless-cat-looking-through-metallic-hence_114579-12034.jpg" },
|
||||
{ brand: "Dog", name: "Max", price: "Adopted", rating: 4, reviewCount: "4 yrs", imageSrc: "http://img.b2bpic.net/free-photo/smiley-young-girl-holding-dog_23-2148316323.jpg" },
|
||||
{ brand: "Cat", name: "Mittens", price: "Adopted", rating: 5, reviewCount: "1 yr", imageSrc: "http://img.b2bpic.net/free-photo/closeup-cat-with-green-eyes-looking-camera-street_181624-55165.jpg" },
|
||||
{ brand: "Dog", name: "Daisy", price: "Adopted", rating: 5, reviewCount: "5 yrs", imageSrc: "http://img.b2bpic.net/free-photo/adorable-chihuahua-dog-outside-walk_23-2149880125.jpg" },
|
||||
{ brand: "Cat", name: "Oliver", price: "Adopted", rating: 4, reviewCount: "6 mos", imageSrc: "http://img.b2bpic.net/free-photo/closeup-person-holding-adorable-tiny-kitten_181624-21695.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutTestimonial
|
||||
tag="Our Mission"
|
||||
quote="Our shelter exists to prove that every animal has value. We work daily to ensure no pet is left behind and that every tail finds its wag again."
|
||||
author="Sarah Miller"
|
||||
role="Shelter Director"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-hugging-his-friendly-pitbull_23-2149131402.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutTestimonial
|
||||
tag="Our Mission"
|
||||
quote="Our shelter exists to prove that every animal has value. We work daily to ensure no pet is left behind and that every tail finds its wag again."
|
||||
author="Sarah Miller"
|
||||
role="Shelter Director"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-hugging-his-friendly-pitbull_23-2149131402.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Happy Tails"
|
||||
title="Adopted Families"
|
||||
description="Hear stories from families whose lives have been enriched by their rescued companions."
|
||||
testimonials={[
|
||||
{
|
||||
name: "David W.",
|
||||
role: "Adopter",
|
||||
quote: "Finding Buddy changed everything. Best decision ever.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-handsome-man-carry-black-pug-smiling-staring-camera-happy-dog-owner-holding-cute-dog-arms-standing-white-background_1258-75769.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jessica L.",
|
||||
role: "Adopter",
|
||||
quote: "Luna is such a cuddle bug. We love her so much.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-family-expecting-baby_23-2150232785.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mark S.",
|
||||
role: "Adopter",
|
||||
quote: "The shelter made adoption so easy and rewarding.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-women-kissing-dog_23-2148977445.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena R.",
|
||||
role: "Adopter",
|
||||
quote: "Mittens is the perfect companion. Thank you!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-japanese-woman-with-cat_23-2150492085.jpg",
|
||||
},
|
||||
{
|
||||
name: "Chris B.",
|
||||
role: "Adopter",
|
||||
quote: "So happy with our new family member. Life is better.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-with-cute-dog-waiting-be-adopted-by-someone_23-2148682989.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Happy Tails"
|
||||
title="Adopted Families"
|
||||
description="Hear stories from families whose lives have been enriched by their rescued companions."
|
||||
testimonials={[
|
||||
{ name: "David W.", role: "Adopter", quote: "Finding Buddy changed everything. Best decision ever.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-handsome-man-carry-black-pug-smiling-staring-camera-happy-dog-owner-holding-cute-dog-arms-standing-white-background_1258-75769.jpg" },
|
||||
{ name: "Jessica L.", role: "Adopter", quote: "Luna is such a cuddle bug. We love her so much.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-family-expecting-baby_23-2150232785.jpg" },
|
||||
{ name: "Mark S.", role: "Adopter", quote: "The shelter made adoption so easy and rewarding.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-women-kissing-dog_23-2148977445.jpg" },
|
||||
{ name: "Elena R.", role: "Adopter", quote: "Mittens is the perfect companion. Thank you!", imageSrc: "http://img.b2bpic.net/free-photo/side-view-japanese-woman-with-cat_23-2150492085.jpg" },
|
||||
{ name: "Chris B.", role: "Adopter", quote: "So happy with our new family member. Life is better.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-with-cute-dog-waiting-be-adopted-by-someone_23-2148682989.jpg" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsGradientCards
|
||||
tag="Our Impact"
|
||||
title="Results You've Helped Achieve"
|
||||
description="Together, we have transformed lives and built a better community for our four-legged friends."
|
||||
metrics={[
|
||||
{
|
||||
value: "1,200+",
|
||||
title: "Pets Adopted",
|
||||
description: "Happy homes found",
|
||||
icon: Home,
|
||||
},
|
||||
{
|
||||
value: "350",
|
||||
title: "Fosters",
|
||||
description: "Temporary homes active",
|
||||
icon: Heart,
|
||||
},
|
||||
{
|
||||
value: "5,000",
|
||||
title: "Vaccinations",
|
||||
description: "Medical care provided",
|
||||
icon: Shield,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricsGradientCards
|
||||
tag="Our Impact"
|
||||
title="Results You've Helped Achieve"
|
||||
description="Together, we have transformed lives and built a better community for our four-legged friends."
|
||||
metrics={[
|
||||
{ value: "1,200+", title: "Pets Adopted", description: "Happy homes found", icon: "Home" },
|
||||
{ value: "350", title: "Fosters", description: "Temporary homes active", icon: "Heart" },
|
||||
{ value: "5,000", title: "Vaccinations", description: "Medical care provided", icon: "Shield" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Common Questions"
|
||||
title="Everything You Need to Know"
|
||||
description="Get clear answers about our adoption process, requirements, and how you can help."
|
||||
items={[
|
||||
{
|
||||
question: "What is the adoption process?",
|
||||
answer: "It involves a screening application, meet-and-greet, and home check.",
|
||||
},
|
||||
{
|
||||
question: "Can I volunteer?",
|
||||
answer: "Yes! We always need volunteers for walking, cleaning, and social events.",
|
||||
},
|
||||
{
|
||||
question: "What if it's not a fit?",
|
||||
answer: "We ensure full transparency and always take our animals back if something goes wrong.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSimple
|
||||
tag="Common Questions"
|
||||
title="Everything You Need to Know"
|
||||
description="Get clear answers about our adoption process, requirements, and how you can help."
|
||||
items={[
|
||||
{ question: "What is the adoption process?", answer: "It involves a screening application, meet-and-greet, and home check." },
|
||||
{ question: "Can I volunteer?", answer: "Yes! We always need volunteers for walking, cleaning, and social events." },
|
||||
{ question: "What if it's not a fit?", answer: "We ensure full transparency and always take our animals back if something goes wrong." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Get Involved"
|
||||
title="Join Our Community"
|
||||
description="Sign up for our newsletter to stay updated on pets in need and upcoming adoption events."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Get Involved"
|
||||
title="Join Our Community"
|
||||
description="Sign up for our newsletter to stay updated on pets in need and upcoming adoption events."
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Subscribe"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBrand
|
||||
brand="Paws & Hope Shelter"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Adopt",
|
||||
href: "#adopt",
|
||||
},
|
||||
{
|
||||
label: "Donate",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBrand
|
||||
brand="Paws & Hope Shelter"
|
||||
columns={[
|
||||
{ items: [{ label: "Adopt", href: "#adopt" }, { label: "Donate", href: "#contact" }] },
|
||||
{ items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user