Add src/app/giving/page.tsx

src/app/giving/page.tsx

@@ -0,0 +1,57 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
+import PricingCardNine from "@/components/sections/pricing/PricingCardNine";
+import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
+import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
+import ReactLenis from "lenis/react";
+
+export default function GivingPage() {
+    const navItems = [
+        { name: "Home", id: "/" },
+        { name: "Giving", id: "/giving" },
+        { name: "Contact", id: "/contact" },
+    ];
+
+    return (
+        <ThemeProvider
+            defaultButtonVariant="icon-arrow"
+            contentWidth="medium"
+        >
+            <ReactLenis root>
+                <NavbarLayoutFloatingInline navItems={navItems} brandName="Coach" />
+                <MetricCardSeven
+                    title="Our Impact"
+                    description="Your generosity makes a real difference. Together, we've supported thousands on their journey."
+                    textboxLayout="split"
+                    animationType="slide-up"
+                    metrics={[
+                        { id: "1", value: "$500k", title: "Total Donated", items: ["Community Support", "Direct Aid"] },
+                        { id: "2", value: "10k", title: "Lives Impacted", items: ["Mentorship Programs", "Events"] },
+                    ]}
+                />
+                <PricingCardNine
+                    title="Support Our Mission"
+                    description="Choose an option that works best for you."
+                    textboxLayout="split"
+                    animationType="slide-up"
+                    plans={[
+                        {
+                            id: "monthly",                            title: "Monthly Partner",                            price: "$50",                            period: "/month",                            features: ["Exclusive updates", "Community access", "Direct impact dashboard"],
+                            button: { text: "Give Monthly", href: "#" },
+                        },
+                        {
+                            id: "one-time",                            title: "One-Time Gift",                            price: "$100",                            period: "",                            features: ["Receipt provided", "Direct impact email"],
+                            button: { text: "Give Now", href: "#" },
+                        },
+                    ]}
+                />
+                <FooterLogoEmphasis
+                    logoText="Coach"
+                    columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Giving", href: "/giving" }, { label: "Contact", href: "/contact" }] }]}
+                />
+            </ReactLenis>
+        </ThemeProvider>
+    );
+}