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,16 +32,11 @@ export default function LandingPage() {
   <div id="nav" data-section="nav">
       <NavbarStyleFullscreen
       navItems={[
-        {
-          name: "Home",          id: "#hero"},
-        {
-          name: "About",          id: "#about"},
-        {
-          name: "Opportunities",          id: "#opportunities"},
-        {
-          name: "FAQ",          id: "#faq"},
-        {
-          name: "Contact",          id: "#contact"},
+        { name: "Home", id: "/" },
+        { name: "About", id: "#about" },
+        { name: "Opportunities", id: "#opportunities" },
+        { name: "FAQ", id: "#faq" },
+        { name: "Contact", id: "/contact" },
       ]}
       brandName="Gateway Volunteers"
     />
@@ -49,48 +44,30 @@ export default function LandingPage() {
 
   <div id="hero" data-section="hero">
       <HeroSplit
-      background={{
-        variant: "plain"}}
+      background={{ variant: "plain" }}
       title="Empower Our St. Louis Community"
       description="Join thousands of dedicated neighbors making a difference. From our neighborhoods to the heart of the city, your help builds a stronger future."
       buttons={[
-        {
-          text: "Get Involved",          href: "#opportunities"},
-        {
-          text: "Learn More",          href: "#about"},
+        { text: "Get Involved", href: "#opportunities" },
+        { text: "Learn More", href: "#about" },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/red-paper-heart-hanging-wood-background_1232-3691.jpg"
       imageAlt="Community volunteers in St. Louis"
       mediaAnimation="slide-up"
       avatars={[
-        {
-          src: "http://img.b2bpic.net/free-photo/diversity-assortment-different-colored-paper-hands-with-copy-space_23-2148642220.jpg",          alt: "Volunteer 1"},
-        {
-          src: "http://img.b2bpic.net/free-photo/helping-hands-volunteer-support-community-service-graphic_53876-64955.jpg",          alt: "Volunteer 2"},
-        {
-          src: "http://img.b2bpic.net/free-photo/community-give-donation-humanity-support-volunteer_53876-13802.jpg",          alt: "Volunteer 3"},
-        {
-          src: "http://img.b2bpic.net/free-photo/top-view-paper-heart-paper-hand-with-copy-space_23-2148635150.jpg",          alt: "Volunteer 4"},
-        {
-          src: "http://img.b2bpic.net/free-photo/team-young-colleagues-having-meeting-cafe_273609-16257.jpg",          alt: "Volunteer 5"},
+        { src: "http://img.b2bpic.net/free-photo/diversity-assortment-different-colored-paper-hands-with-copy-space_23-2148642220.jpg", alt: "Volunteer 1" },
+        { src: "http://img.b2bpic.net/free-photo/helping-hands-volunteer-support-community-service-graphic_53876-64955.jpg", alt: "Volunteer 2" },
+        { src: "http://img.b2bpic.net/free-photo/community-give-donation-humanity-support-volunteer_53876-13802.jpg", alt: "Volunteer 3" },
+        { src: "http://img.b2bpic.net/free-photo/top-view-paper-heart-paper-hand-with-copy-space_23-2148635150.jpg", alt: "Volunteer 4" },
+        { src: "http://img.b2bpic.net/free-photo/team-young-colleagues-having-meeting-cafe_273609-16257.jpg", alt: "Volunteer 5" },
       ]}
       avatarText="Join our 450+ volunteers"
       marqueeItems={[
-        {
-          type: "text-icon",          text: "Inclusive Environment",          icon: Users,
-        },
-        {
-          type: "text-icon",          text: "Local Impact",          icon: MapPin,
-        },
-        {
-          type: "text-icon",          text: "Skills Growth",          icon: TrendingUp,
-        },
-        {
-          type: "text-icon",          text: "Flexible Hours",          icon: Clock,
-        },
-        {
-          type: "text-icon",          text: "Community Unity",          icon: Heart,
-        },
+        { type: "text-icon", text: "Inclusive Environment", icon: Users },
+        { type: "text-icon", text: "Local Impact", icon: MapPin },
+        { type: "text-icon", text: "Skills Growth", icon: TrendingUp },
+        { type: "text-icon", text: "Flexible Hours", icon: Clock },
+        { type: "text-icon", text: "Community Unity", icon: Heart },
       ]}
     />
   </div>
@@ -100,8 +77,7 @@ export default function LandingPage() {
       useInvertedBackground={false}
       title="Our Mission for St. Louis"
       buttons={[
-        {
-          text: "Our History",          href: "#"},
+        { text: "Our History", href: "#" },
       ]}
     />
   </div>
@@ -112,12 +88,9 @@ export default function LandingPage() {
       title="Our Collective Impact"
       tag="Yearly Progress"
       metrics={[
-        {
-          id: "m1",          value: "12,000+",          description: "Hours Donated"},
-        {
-          id: "m2",          value: "450",          description: "Active Volunteers"},
-        {
-          id: "m3",          value: "85",          description: "Community Partners"},
+        { id: "m1", value: "12,000+", description: "Hours Donated" },
+        { id: "m2", value: "450", description: "Active Volunteers" },
+        { id: "m3", value: "85", description: "Community Partners" },
       ]}
       metricsAnimation="slide-up"
     />
@@ -130,11 +103,14 @@ export default function LandingPage() {
       useInvertedBackground={false}
       features={[
         {
-          id: "f1",          title: "Food Pantry",          subtitle: "Support local families.",          category: "Direct Service",          value: "Weekly"},
+          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"},
+          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"},
+          id: "f3",          title: "Park Cleanup",          subtitle: "Improve local green space.",          category: "Environment",          value: "Weekend",          buttons: [{ text: "Join Us", href: "/contact" }]
+        },
       ]}
       title="Volunteer Opportunities"
       description="Find your perfect role in our community projects."
@@ -145,16 +121,11 @@ export default function LandingPage() {
       <TestimonialCardTwelve
       useInvertedBackground={true}
       testimonials={[
-        {
-          id: "t1",          name: "Sarah Miller",          imageSrc: "http://img.b2bpic.net/free-photo/volunteers-with-food-donations-close-up_23-2149182030.jpg"},
-        {
-          id: "t2",          name: "James Henderson",          imageSrc: "http://img.b2bpic.net/free-photo/male-bus-driver-posing-portrait_23-2151582399.jpg"},
-        {
-          id: "t3",          name: "Maria Garcia",          imageSrc: "http://img.b2bpic.net/free-photo/people-taking-selfie-football-game_23-2149015520.jpg"},
-        {
-          id: "t4",          name: "David Wilson",          imageSrc: "http://img.b2bpic.net/free-photo/cropped-image-glad-female-smiles-gently-has-hiking-tour-with-rucksack_273609-25972.jpg"},
-        {
-          id: "t5",          name: "Elena Ross",          imageSrc: "http://img.b2bpic.net/free-photo/diverse-volunteers-taking-selfie-together_53876-13557.jpg"},
+        { id: "t1", name: "Sarah Miller", imageSrc: "http://img.b2bpic.net/free-photo/volunteers-with-food-donations-close-up_23-2149182030.jpg" },
+        { id: "t2", name: "James Henderson", imageSrc: "http://img.b2bpic.net/free-photo/male-bus-driver-posing-portrait_23-2151582399.jpg" },
+        { id: "t3", name: "Maria Garcia", imageSrc: "http://img.b2bpic.net/free-photo/people-taking-selfie-football-game_23-2149015520.jpg" },
+        { id: "t4", name: "David Wilson", imageSrc: "http://img.b2bpic.net/free-photo/cropped-image-glad-female-smiles-gently-has-hiking-tour-with-rucksack_273609-25972.jpg" },
+        { id: "t5", name: "Elena Ross", imageSrc: "http://img.b2bpic.net/free-photo/diverse-volunteers-taking-selfie-together_53876-13557.jpg" },
       ]}
       cardTitle="Voices of the Community"
       cardTag="Heartfelt Stories"
@@ -167,7 +138,8 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       names={[
-        "City of St. Louis",        "Gateway Food Bank",        "Metro Parks Foundation",        "St. Louis Reads",        "Arts Council"]}
+        "City of St. Louis", "Gateway Food Bank", "Metro Parks Foundation", "St. Louis Reads", "Arts Council"
+      ]}
       title="Proud Partners"
       description="Collaborating with local leaders across the city."
     />
@@ -178,28 +150,20 @@ export default function LandingPage() {
       useInvertedBackground={true}
       faqs={[
         {
-          id: "q1",          title: "How do I start volunteering?",          content: "Getting started is simple: create an account on our platform, browse the available volunteer projects based on your interests, and sign up for an orientation session."},
+          id: "q1",          title: "How do I start volunteering?",          content: "Getting started is simple: create an account on our platform, browse the available volunteer projects based on your interests, and sign up for an orientation session. Once registered, our coordinators will reach out via email to match you with a project."
+        },
         {
-          id: "q2",          title: "Do I need prior experience?",          content: "No specific experience is required for most roles! We provide comprehensive on-the-job training and guidance to ensure you feel confident and prepared for your assigned tasks."},
+          id: "q2",          title: "Do I need prior experience?",          content: "No specific experience is required for most roles! We provide comprehensive on-the-job training and guidance to ensure you feel confident and prepared. Our team is dedicated to pairing your skills with community needs."
+        },
         {
-          id: "q3",          title: "Can I choose my schedule?",          content: "Absolutely. We offer flexible shifts across various programs, allowing you to choose the times and dates that align with your personal and professional commitments."},
+          id: "q3",          title: "How flexible is the schedule?",          content: "We offer highly flexible shifts across all our programs, from weekday food pantry support to weekend park cleanups. You can manage your availability directly through your volunteer portal. For specialized scheduling requests, contact us directly."
+        },
       ]}
       sideTitle="Questions?"
       faqsAnimation="slide-up"
     />
   </div>
 
-  <div id="contact" data-section="contact">
-      <ContactCenter
-      useInvertedBackground={false}
-      background={{
-        variant: "plain"}}
-      tag="Contact Us"
-      title="Join the Movement"
-      description="Sign up for our newsletter to get local updates."
-    />
-  </div>
-
   <div id="footer" data-section="footer">
       <FooterCard
       logoText="Gateway Volunteers"
@@ -209,4 +173,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}