127 lines
6.3 KiB
TypeScript
127 lines
6.3 KiB
TypeScript
"use client";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import Link from "next/link";
|
|
|
|
export default function AboutPage() {
|
|
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.map(item => ({...item, id: item.id.startsWith('/') ? item.id : `#${item.id}`}))} button={navButton} brandName="Hope Haven" className="py-4" />
|
|
</div>
|
|
|
|
<div id="about-us" data-section="about-us">
|
|
<MediaSplitTabsAbout
|
|
title="Our Story & Mission"
|
|
description="At Hope Haven, we believe every animal deserves a loving, forever home. We're dedicated to rescuing, rehabiliting, and rehoming pets in need."
|
|
tabs={[
|
|
{ id: "who-we-are", label: "Who We Are", description: "Hope Haven Animal Shelter is a non-profit organization founded on the principle of compassion and second chances. Our dedicated team works tirelessly to provide a safe haven for abandoned, neglected, and surrendered animals. We believe in transparency, integrity, and putting the well-being of our animals first." },
|
|
{ id: "our-values", label: "Our Values", description: "Our core values include compassion, respect, responsibility, and community. We treat every animal with the dignity they deserve, advocate for responsible pet ownership, and foster a supportive community of volunteers and adopters. These values guide every decision we make and every life we touch." },
|
|
{ id: "our-impact", label: "Our Impact", description: "Since our inception, Hope Haven has facilitated thousands of successful adoptions, provided critical medical care to countless animals, and educated the public on animal welfare. Our work extends beyond rehoming; we strive to create a healthier, more compassionate community for both pets and people." }
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/portrait-woman-with-her-beautiful-dog_1157-36179.jpg"
|
|
imageAlt="Team of volunteers caring for animals at the shelter"
|
|
imagePosition="right"
|
|
mediaAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
titleClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<div id="our-impact" data-section="our-impact">
|
|
<MetricCardSeven
|
|
title="Our Impact in Numbers"
|
|
description="See how your support makes a real difference in the lives of countless animals."
|
|
metrics={[
|
|
{ id: "1", value: "5,000+", title: "Pets Rehomed", items: ["Successfully placed in loving families", "Reduced shelter population"] },
|
|
{ id: "2", value: "2,500+", title: "Medical Procedures", items: ["Life-saving surgeries & treatments", "Routine check-ups & vaccinations"] },
|
|
{ id: "3", value: "10,000+", title: "Volunteer Hours", items: ["Dedicated individuals giving back", "Essential support for daily operations"] }
|
|
]}
|
|
animationType="depth-3d"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Making a Difference"
|
|
titleClassName="font-light"
|
|
textBoxDescriptionClassName="font-light"
|
|
metricTitleClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<div id="partners" data-section="partners">
|
|
<SocialProofOne
|
|
title="Our Valued Community Partners"
|
|
description="We're grateful for the support of these organizations who help us make a difference."
|
|
logos={[
|
|
"https://img.b2bpic.net/free-vector/collection-colorful-pet-shop-stickers_23-2147569707.jpg", "https://img.b2bpic.net/free-vector/veterinary-clinic-labels-collection_23-2149714004.jpg", "https://img.b2bpic.net/free-psd/pets-template-design_23-2151517542.jpg", "https://img.b2bpic.net/free-vector/veterinary-logo-collection_1346-55.jpg", "https://img.b2bpic.net/free-vector/veterinary-clinic-logo-templates_23-2147536016.jpg", "https://img.b2bpic.net/free-vector/vintage-cruelty-free-logo_23-2149452211.jpg", "https://img.b2bpic.net/free-vector/logo-with-pet-design_1363-32.jpg"
|
|
]}
|
|
speed={40}
|
|
showCard={true}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Partnerships"
|
|
titleClassName="font-light"
|
|
textBoxDescriptionClassName="font-light"
|
|
logoTextClassName="font-light"
|
|
/>
|
|
</div>
|
|
|
|
<FooterBase
|
|
columns={footerColumns}
|
|
logoText="Hope Haven"
|
|
copyrightText="© 2024 Hope Haven Animal Shelter. All rights reserved."
|
|
useInvertedBackground={false}
|
|
/>
|
|
</ThemeProvider>
|
|
);
|
|
} |