Merge version_2 into main

Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-02-19 13:43:10 +00:00
5 changed files with 162 additions and 93 deletions

83
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,83 @@
"use client";
import React from 'react';
import ReactLenis from "lenis/react";
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FooterSimple from '@/components/sections/footer/FooterSimple';
export default function AboutPage() {
const commonNavItems = [
{ name: 'Home', id: '/' },
{ name: 'Adopt', id: '#adopt' },
{ name: 'About', id: '/about' },
{ name: 'Volunteer', id: '#team' },
{ name: 'Blog', id: '/blog' },
{ name: 'Shop', id: '/shop' },
{ name: 'Contact', id: '#contact' },
];
const commonFooterColumns = [
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#team' }, { label: 'About Us', href: '/about' }, { label: 'FAQ', href: '#faq' }, { label: 'Blog', href: '/blog' }, { label: 'Shop', href: '/shop' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="small"
sizing="mediumLargeSizeLargeTitles"
background="grid"
cardStyle="glass-depth"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: 'Donate', href: '#donate' }}
className="py-4 px-6 md:px-8 lg:px-12"
buttonClassName="px-5 py-2"
buttonTextClassName="text-lg font-semibold"
/>
</div>
<main>
<div id="about-us-hero" data-section="about-us-hero">
<MediaSplitTabsAbout
title="About Pet Haven: Our Story & Values"
description="Dedicated to giving every animal a second chance, Pet Haven has been a beacon of hope for abandoned and neglected pets for over a decade. Discover our journey, our team, and what drives us."
tabs={[
{ id: 'mission', label: 'Our Mission', description: 'At Pet Haven, our core mission is to rescue, rehabilitate, and rehome every animal in need. We provide comprehensive care, medical attention, and a loving temporary home for countless dogs, cats, and small animals. Our commitment extends to promoting responsible pet ownership and advocating for animal welfare in the community.' },
{ id: 'vision', label: 'Our Vision', description: 'We envision a world where every companion animal lives a life free from neglect and cruelty, in a safe and loving home. Pet Haven strives to be a leading voice in animal advocacy, working towards a future where euthanasia of healthy, adoptable animals is a thing of the past, and every pet finds its perfect match.' },
{ id: 'values', label: 'Our Values', description: 'Compassion, integrity, and dedication are the pillars of Pet Haven. We believe in treating every animal with kindness and respect, operating with transparency, and fostering a strong, supportive community of volunteers and adopters. Our work is driven by a deep love for animals and an unwavering commitment to their well-being.' },
]}
imageSrc="https://img.b2bpic.net/free-photo/group-dogs-walking-park_23-2150339906.jpg"
imageAlt="A group of happy dogs walking in a park"
mediaAnimation="slide-up"
imagePosition="right"
useInvertedBackground={false}
className="py-16 md:py-24 lg:py-32"
/>
</div>
</main>
<div id="footer" data-section="footer">
<FooterSimple
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -16,6 +16,22 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
export default function BlogPage() {
const { posts, isLoading } = useBlogPosts();
const commonNavItems = [
{ name: 'Home', id: '/' },
{ name: 'Adopt', id: '#adopt' },
{ name: 'About', id: '/about' },
{ name: 'Volunteer', id: '#team' },
{ name: 'Blog', id: '/blog' },
{ name: 'Shop', id: '/shop' },
{ name: 'Contact', id: '#contact' },
];
const commonFooterColumns = [
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#team' }, { label: 'About Us', href: '/about' }, { label: 'FAQ', href: '#faq' }, { label: 'Blog', href: '/blog' }, { label: 'Shop', href: '/shop' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
@@ -31,13 +47,7 @@ export default function BlogPage() {
>
<ReactLenis root>
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "Adopt", id: "adopt" },
{ name: "About", id: "about" },
{ name: "Volunteer", id: "volunteer" },
{ name: "Contact", id: "contact" },
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Donate", href: "#donate" }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -64,30 +74,7 @@ export default function BlogPage() {
</main>
<FooterSimple
columns={[
{
title: "Quick Links", items: [
{ label: "Adopt", href: "#adopt" },
{ label: "Volunteer", href: "#volunteer" },
{ label: "About Us", href: "#about" },
{ label: "FAQ", href: "#faq" },
],
},
{
title: "Get Involved", items: [
{ label: "Donate", href: "#donate" },
{ label: "Foster", href: "#foster" },
{ label: "Events", href: "#events" },
],
},
{
title: "Contact", items: [
{ label: "Email Us", href: "mailto:info@pethaven.org" },
{ label: "Call Us", href: "tel:+1234567890" },
{ label: "Location", href: "#location" },
],
},
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"

View File

@@ -15,6 +15,22 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Cat, Dog, Heart, HeartHandshake, Home, PawPrint, Rabbit, Users } from 'lucide-react';
export default function LandingPage() {
const commonNavItems = [
{ name: 'Home', id: '/' },
{ name: 'Adopt', id: '#adopt' },
{ name: 'About', id: '/about' },
{ name: 'Volunteer', id: '#team' },
{ name: 'Blog', id: '/blog' },
{ name: 'Shop', id: '/shop' },
{ name: 'Contact', id: '#contact' },
];
const commonFooterColumns = [
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#team' }, { label: 'About Us', href: '/about' }, { label: 'FAQ', href: '#faq' }, { label: 'Blog', href: '/blog' }, { label: 'Shop', href: '/shop' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
@@ -30,7 +46,7 @@ export default function LandingPage() {
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[{ name: 'Adopt', id: 'adopt' }, { name: 'About', id: 'about' }, { name: 'Volunteer', id: 'volunteer' }, { name: 'Contact', id: 'contact' }]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: 'Donate', href: '#donate' }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -46,7 +62,7 @@ export default function LandingPage() {
background={{ variant: 'radial-gradient' }}
tag="Adopt, Don't Shop"
tagIcon={PawPrint}
buttons={[{ text: 'View Adoptable Pets', href: '#adopt' }, { text: 'Learn More', href: '#about' }]}
buttons={[{ text: 'View Adoptable Pets', href: '#adopt' }, { text: 'Learn More', href: '/about' }]}
dashboard={{
title: 'Meet Our Latest Arrivals',
logoIcon: HeartHandshake,
@@ -201,11 +217,7 @@ export default function LandingPage() {
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#volunteer' }, { label: 'About Us', href: '#about' }, { label: 'FAQ', href: '#faq' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"

View File

@@ -66,6 +66,22 @@ export default function ProductPage({ params }: ProductPageProps) {
await checkout(getCheckoutItems(), { successUrl: currentUrl.toString() });
}, [cartItems, checkout, getCheckoutItems]);
const commonNavItems = [
{ name: 'Home', id: '/' },
{ name: 'Adopt', id: '#adopt' },
{ name: 'About', id: '/about' },
{ name: 'Volunteer', id: '#team' },
{ name: 'Blog', id: '/blog' },
{ name: 'Shop', id: '/shop' },
{ name: 'Contact', id: '#contact' },
];
const commonFooterColumns = [
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#team' }, { label: 'About Us', href: '/about' }, { label: 'FAQ', href: '#faq' }, { label: 'Blog', href: '/blog' }, { label: 'Shop', href: '/shop' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
];
if (isLoading) {
return (
<ThemeProvider
@@ -83,12 +99,7 @@ export default function ProductPage({ params }: ProductPageProps) {
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Shop", id: "/shop" }
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -101,11 +112,7 @@ export default function ProductPage({ params }: ProductPageProps) {
</main>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Quick Links", items: [{ label: "Adopt", href: "#adopt" }, { label: "Volunteer", href: "#volunteer" }, { label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }] },
{ title: "Get Involved", items: [{ label: "Donate", href: "#donate" }, { label: "Foster", href: "#foster" }, { label: "Events", href: "#events" }] },
{ title: "Contact", items: [{ label: "Email Us", href: "mailto:info@pethaven.org" }, { label: "Call Us", href: "tel:+1234567890" }, { label: "Location", href: "#location" }] }
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"
@@ -133,12 +140,7 @@ export default function ProductPage({ params }: ProductPageProps) {
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Shop", id: "/shop" }
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -159,11 +161,7 @@ export default function ProductPage({ params }: ProductPageProps) {
</main>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Quick Links", items: [{ label: "Adopt", href: "#adopt" }, { label: "Volunteer", href: "#volunteer" }, { label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }] },
{ title: "Get Involved", items: [{ label: "Donate", href: "#donate" }, { label: "Foster", href: "#foster" }, { label: "Events", href: "#events" }] },
{ title: "Contact", items: [{ label: "Email Us", href: "mailto:info@pethaven.org" }, { label: "Call Us", href: "tel:+1234567890" }, { label: "Location", href: "#location" }] }
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"
@@ -190,12 +188,7 @@ export default function ProductPage({ params }: ProductPageProps) {
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Shop", id: "/shop" }
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -241,11 +234,7 @@ export default function ProductPage({ params }: ProductPageProps) {
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Quick Links", items: [{ label: "Adopt", href: "#adopt" }, { label: "Volunteer", href: "#volunteer" }, { label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }] },
{ title: "Get Involved", items: [{ label: "Donate", href: "#donate" }, { label: "Foster", href: "#foster" }, { label: "Events", href: "#events" }] },
{ title: "Contact", items: [{ label: "Email Us", href: "mailto:info@pethaven.org" }, { label: "Call Us", href: "tel:+1234567890" }, { label: "Location", href: "#location" }] }
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"

View File

@@ -16,6 +16,22 @@ export default function ShopPage() {
filters,
} = useProductCatalog({ basePath: "/shop" });
const commonNavItems = [
{ name: 'Home', id: '/' },
{ name: 'Adopt', id: '#adopt' },
{ name: 'About', id: '/about' },
{ name: 'Volunteer', id: '#team' },
{ name: 'Blog', id: '/blog' },
{ name: 'Shop', id: '/shop' },
{ name: 'Contact', id: '#contact' },
];
const commonFooterColumns = [
{ title: 'Quick Links', items: [{ label: 'Adopt', href: '#adopt' }, { label: 'Volunteer', href: '#team' }, { label: 'About Us', href: '/about' }, { label: 'FAQ', href: '#faq' }, { label: 'Blog', href: '/blog' }, { label: 'Shop', href: '/shop' }] },
{ title: 'Get Involved', items: [{ label: 'Donate', href: '#donate' }, { label: 'Foster', href: '#foster' }, { label: 'Events', href: '#events' }] },
{ title: 'Contact', items: [{ label: 'Email Us', href: 'mailto:info@pethaven.org' }, { label: 'Call Us', href: 'tel:+1234567890' }, { label: 'Location', href: '#location' }] },
];
if (isLoading) {
return (
<ThemeProvider
@@ -33,12 +49,7 @@ export default function ShopPage() {
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Shop", id: "/shop" }
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Cart", onClick: () => console.log("Cart clicked") }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -51,11 +62,7 @@ export default function ShopPage() {
</main>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Quick Links", items: [{ label: "Adopt", href: "#adopt" }, { label: "Volunteer", href: "#volunteer" }, { label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }] },
{ title: "Get Involved", items: [{ label: "Donate", href: "#donate" }, { label: "Foster", href: "#foster" }, { label: "Events", href: "#events" }] },
{ title: "Contact", items: [{ label: "Email Us", href: "mailto:info@pethaven.org" }, { label: "Call Us", href: "tel:+1234567890" }, { label: "Location", href: "#location" }] }
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"
@@ -82,12 +89,7 @@ export default function ShopPage() {
<ReactLenis root>
<div id="navbar" data-section="navbar">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Shop", id: "/shop" }
]}
navItems={commonNavItems}
brandName="Pet Haven"
button={{ text: "Cart", onClick: () => console.log("Cart clicked") }}
className="py-4 px-6 md:px-8 lg:px-12"
@@ -108,11 +110,7 @@ export default function ShopPage() {
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Quick Links", items: [{ label: "Adopt", href: "#adopt" }, { label: "Volunteer", href: "#volunteer" }, { label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }] },
{ title: "Get Involved", items: [{ label: "Donate", href: "#donate" }, { label: "Foster", href: "#foster" }, { label: "Events", href: "#events" }] },
{ title: "Contact", items: [{ label: "Email Us", href: "mailto:info@pethaven.org" }, { label: "Call Us", href: "tel:+1234567890" }, { label: "Location", href: "#location" }] }
]}
columns={commonFooterColumns}
bottomLeftText="© 2024 Pet Haven. All rights reserved."
bottomRightText="A home for every paw."
className="py-12 md:py-16 lg:py-20"