Switch to version 2: modified src/app/about/page.tsx

This commit is contained in:
2026-03-09 19:57:24 +00:00
parent edda17b854
commit ee4a577d38

View File

@@ -3,24 +3,21 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import TextAbout from "@/components/sections/about/TextAbout";
import TeamCardTwo from "@/components/sections/team/TeamCardTwo";
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import Link from "next/link";
import { Linkedin, Twitter, Heart, Globe, Mail } from "lucide-react";
import { Heart, Shield, Users, Award } from "lucide-react";
const AboutPage = () => {
export default function AboutPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Browse Animals", id: "/animals" },
{ name: "About", id: "about" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "contact" },
];
const footerColumns = [
{
title: "Adoption",
items: [
title: "Adoption", items: [
{ label: "Browse Pets", href: "/animals" },
{ label: "How to Adopt", href: "#how-it-works" },
{ label: "Adoption Stories", href: "#adoption-stories" },
@@ -28,8 +25,7 @@ const AboutPage = () => {
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Our Team", href: "#team" },
{ label: "Partner with Us", href: "/partner" },
@@ -37,8 +33,7 @@ const AboutPage = () => {
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "Contact Us", href: "/contact" },
{ label: "Donate", href: "/donate" },
{ label: "Volunteer", href: "/volunteer" },
@@ -46,8 +41,7 @@ const AboutPage = () => {
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Cookie Policy", href: "#" },
@@ -73,169 +67,70 @@ const AboutPage = () => {
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="PawsHome"
button={{
text: "Start Adoption",
href: "/animals",
}}
button={{ text: "Start Adoption", href: "/animals" }}
animateOnLoad={true}
/>
</div>
<div id="about" data-section="about">
<div id="mission" data-section="mission">
<TextAbout
tag="Our Mission"
tagIcon={Heart}
tagAnimation="slide-up"
title="We believe every animal deserves a loving home and every family deserves the joy of pet companionship"
useInvertedBackground={true}
title="Transforming Lives Through Pet Adoption: Our Mission to Connect Loving Families with Deserving Animals"
useInvertedBackground={false}
buttons={[
{
text: "Our Story",
href: "/about",
},
{
text: "How We Help",
href: "#how-it-works",
},
{ text: "Get Involved", href: "/contact" },
{ text: "Become a Partner", href: "/partner" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="team" data-section="team">
<TeamCardTwo
title="Meet Our Dedicated Team"
description="Passionate animal lovers and adoption specialists committed to finding perfect homes for every pet in our care."
tag="Our Team"
tagIcon={Heart}
<div id="shelter-info" data-section="shelter-info">
<TextAbout
tag="About Our Shelter"
tagIcon={Users}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
title="PawsHome is a comprehensive animal welfare organization dedicated to rescuing, rehabilitating, and rehoming animals in need. Our state-of-the-art facility provides medical care, behavioral support, and individual attention to every animal in our care, ensuring they are healthy, happy, and ready for their forever homes."
useInvertedBackground={true}
gridVariant="three-columns-all-equal-width"
members={[
{
id: "1",
name: "Emma Thompson",
role: "Founder & Director",
description:
"Veterinarian with 15 years of experience in animal welfare and sanctuary management. Passionate about creating systemic change in pet adoption.",
imageSrc: "http://img.b2bpic.net/free-photo/doctor-carrying-little-gray-puppy_329181-10394.jpg",
imageAlt: "Emma Thompson, Founder & Director",
socialLinks: [
{
icon: Linkedin,
url: "https://linkedin.com",
},
{
icon: Twitter,
url: "https://twitter.com",
},
],
},
{
id: "2",
name: "Marcus Rodriguez",
role: "Adoption Counselor",
description:
"Former shelter manager with deep expertise in matching families with the right pets. Has facilitated over 800 successful adoptions.",
imageSrc: "http://img.b2bpic.net/free-photo/pet-owner-pouring-water-his-friend-bowl_259150-57216.jpg",
imageAlt: "Marcus Rodriguez, Adoption Counselor",
socialLinks: [
{
icon: Linkedin,
url: "https://linkedin.com",
},
{
icon: Heart,
url: "https://example.com",
},
],
},
{
id: "3",
name: "Aisha Patel",
role: "Animal Care Manager",
description:
"Certified animal behaviorist dedicated to ensuring every pet receives individualized care and attention while waiting for their new families.",
imageSrc: "http://img.b2bpic.net/free-photo/x-ray-image-puppy-s-body_329181-14495.jpg",
imageAlt: "Aisha Patel, Animal Care Manager",
socialLinks: [
{
icon: Linkedin,
url: "https://linkedin.com",
},
{
icon: Globe,
url: "https://example.com",
},
],
},
{
id: "4",
name: "James Chen",
role: "Volunteer Coordinator",
description:
"Organizes and manages 50+ active volunteers. Passionate about community engagement and building a support network around animal adoption.",
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-looking-camera-while-holding-cellphone-near-red-wall_23-2148193969.jpg",
imageAlt: "James Chen, Volunteer Coordinator",
socialLinks: [
{
icon: Linkedin,
url: "https://linkedin.com",
},
{
icon: Mail,
url: "mailto:james@pawshome.com",
},
],
},
buttons={[
{ text: "Visit Our Facility", href: "/contact" },
{ text: "Volunteer With Us", href: "/volunteer" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardSeven
title="Our Impact By The Numbers"
description="Real statistics showing the difference we're making in animal welfare and pet adoption across our network."
tag="Success Metrics"
tagIcon={Heart}
<div id="values" data-section="values">
<TextAbout
tag="Our Core Values"
tagIcon={Award}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
title="Compassion, Transparency, Excellence. We believe in treating every animal with dignity and respect, operating with complete transparency in all our processes, and maintaining the highest standards of animal care and adoption practices."
useInvertedBackground={false}
metrics={[
{
id: "1",
value: "2,500+",
title: "Animals Successfully Adopted",
items: [
"All thoroughly vetted and health-checked",
"Average adoption timeline: 2-3 weeks",
"95% success rate on first-attempt matches",
],
},
{
id: "2",
value: "150+",
title: "Partner Shelters & Rescues",
items: [
"Network across 25 states",
"Supporting small and large operations",
"Unified adoption platform access",
],
},
{
id: "3",
value: "15K+",
title: "Active Community Members",
items: [
"Engaged adopters and supporters",
"50+ trained volunteer advocates",
"Growing monthly membership",
],
},
buttons={[
{ text: "Learn Our Standards", href: "#" },
{ text: "Read Our Impact Report", href: "#" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="contact-cta" data-section="contact-cta">
<ContactCTA
tag="Questions About Our Shelter"
tagIcon={Shield}
tagAnimation="slide-up"
title="We'd Love to Hear from You"
description="Whether you have questions about our services, want to schedule a facility tour, or are interested in partnership opportunities, our team is here to help."
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Contact Us", href: "/contact" },
{ text: "Schedule a Tour", href: "/contact" },
]}
buttonAnimation="slide-up"
useInvertedBackground={true}
/>
</div>
@@ -248,6 +143,4 @@ const AboutPage = () => {
</div>
</ThemeProvider>
);
};
export default AboutPage;
}