Update src/app/contact/page.tsx

Merge version_3 into main

src/app/contact/page.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterCard from '@/components/sections/footer/FooterCard';
+
+export default function ContactPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="mediumSmall"
+      sizing="largeSmallSizeMediumTitles"
+      background="aurora"
+      cardStyle="inset"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="glass"
+      headingFontWeight="semibold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "About", id: "/#about" },
+              { name: "Opportunities", id: "/#opportunities" },
+              { name: "FAQ", id: "/#faq" },
+              { name: "Contact", id: "/contact" },
+            ]}
+            brandName="Gateway Volunteers"
+          />
+        </div>
+
+        <div id="contact" data-section="contact">
+          <ContactCenter
+            tag="Contact Us"
+            title="Get in Touch"
+            description="We would love to hear from you. For direct support, please email us at support@gatewayvolunteers.org or call our office at (314) 555-0199. Our team is available Monday through Friday, 9:00 AM - 5:00 PM CST."
+            background={{ variant: "plain" }}
+            useInvertedBackground={false}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterCard
+            logoText="Gateway Volunteers"
+            copyrightText="© 2025 Gateway Volunteers"
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -32,11 +32,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        { name: "Home", id: "#hero" },
+        { name: "Home", id: "/" },
         { name: "About", id: "#about" },
         { name: "Opportunities", id: "#opportunities" },
         { name: "FAQ", id: "#faq" },
-        { name: "Contact", id: "#contact" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Gateway Volunteers"
     />
@@ -103,13 +103,13 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "f1",          title: "Food Pantry",          subtitle: "Support local families.",          category: "Direct Service",          value: "Weekly",          buttons: [{ text: "Sign Up", href: "#contact" }]
+          id: "f1",          title: "Food Pantry",          subtitle: "Support local families.",          category: "Direct Service",          value: "Weekly",          buttons: [{ text: "Sign Up", href: "/contact" }]
         },
         {
-          id: "f2",          title: "Mentoring",          subtitle: "Guide local youth.",          category: "Education",          value: "Monthly",          buttons: [{ text: "Get Started", href: "#contact" }]
+          id: "f2",          title: "Mentoring",          subtitle: "Guide local youth.",          category: "Education",          value: "Monthly",          buttons: [{ text: "Get Started", href: "/contact" }]
         },
         {
-          id: "f3",          title: "Park Cleanup",          subtitle: "Improve local green space.",          category: "Environment",          value: "Weekend",          buttons: [{ text: "Join Us", href: "#contact" }]
+          id: "f3",          title: "Park Cleanup",          subtitle: "Improve local green space.",          category: "Environment",          value: "Weekend",          buttons: [{ text: "Join Us", href: "/contact" }]
         },
       ]}
       title="Volunteer Opportunities"
@@ -164,16 +164,6 @@ export default function LandingPage() {
     />
   </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
-      useInvertedBackground={false}
-      background={{ variant: "plain" }}
-      tag="Contact Us"
-      title="Reach Out Directly"
-      description="Need specific help? Contact our coordinator at support@gatewayvolunteers.org or call us at (314) 555-0199 for immediate assistance."
-    />
-  </div>
-
   <div id="footer" data-section="footer">
       <FooterCard
       logoText="Gateway Volunteers"