Update src/app/page.tsx

Merge version_22 into main

src/app/contact/page.tsx

@@ -2,11 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import { useRouter } from "next/navigation";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 
 export default function ContactPage() {
+  const router = useRouter();
+
   return (
     <ThemeProvider
         defaultButtonVariant="expand-hover"
@@ -21,42 +24,33 @@ export default function ContactPage() {
         headingFontWeight="extrabold"
     >
       <ReactLenis root>
-        <div id="nav">
-            <NavbarLayoutFloatingOverlay
-            navItems={[
-              { name: "About", id: "/about"},
-              { name: "Services", id: "/#services"},
-              { name: "Team", id: "/#team"},
-              { name: "Testimonials", id: "/#testimonials"},
-              { name: "FAQ", id: "/#faq"},
-              { name: "Contact", id: "/contact"},
-            ]}
-            brandName="Lackawanna"
+        <div id="nav" data-section="nav">
+            <NavbarStyleApple
+              navItems={[
+                { name: "Home", id: "/" },
+                { name: "About", id: "/about" },
+                { name: "Contact", id: "/contact" }
+              ]}
+              brandName="Lackawanna"
             />
         </div>
 
-        <div id="contact-content" className="pt-32 pb-24">
-            <ContactSplitForm
+        <div id="contact-content" data-section="contact-content" className="pt-32 pb-24">
+            <ContactCTA
+                tag="Contact"
                 title="Ready for your next cut?"
                 description="Stop by our Morristown shop or give us a call at (973) 538-1675 to inquire about wait times."
-                inputs={[
-                    { name: "name", type: "text", placeholder: "Your Name", required: true },
-                    { name: "email", type: "email", placeholder: "Your Email", required: true }
-                ]}
-                textarea={{ name: "message", placeholder: "Tell us what you're looking for..." }}
-                imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CRaO5i0elf1aDIpszoFKWNR31x/uploaded-1776352201800-hefnk77v.jpg"
+                buttons={[{ text: "Submit", onClick: () => router.push("/") }]}
+                background={{ variant: "plain" }}
                 useInvertedBackground={true}
-                mediaPosition="right"
             />
         </div>
 
-        <div id="footer">
-            <FooterLogoEmphasis
+        <div id="footer" data-section="footer">
+            <FooterLogoReveal
                 logoText="Lackawanna Barber Shop"
-                columns={[
-                { items: [{ label: "132 Morris St, Morristown, NJ", href: "/contact" }, { label: "+1 (973) 538-1675", href: "tel:+19735381675" }] },
-                { items: [{ label: "Services", href: "/#services" }, { label: "Team", href: "/#team" }, { label: "FAQs", href: "/#faq" }] }
-                ]}
+                leftLink={{ text: "Contact", href: "/contact" }}
+                rightLink={{ text: "Home", href: "/" }}
             />
         </div>
       </ReactLenis>

src/app/page.tsx

@@ -77,9 +77,9 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       plans={[
-        { id: "basic", badge: "Classic", price: "$40", subtitle: "Precision Haircut", features: ["Classic Scissor Cut", "Modern Styling", "Expert Consultation"], buttons: [{text: "Book Now", href: "/contact"}]},
-        { id: "pro", badge: "Premium", price: "$75", subtitle: "Full Grooming Experience", features: ["Precision Haircut", "Beard Trim", "Hot Towel Service", "Relaxed Refresh"], buttons: [{text: "Book Now", href: "/contact"}]},
-        { id: "kids", badge: "Family", price: "$30", subtitle: "Youth Haircut", features: ["Gentle Scissor Cut", "Fast Friendly Service", "Classic Style"], buttons: [{text: "Book Now", href: "/contact"}]},
+        { id: "basic", badge: "Classic", price: "$40", subtitle: "Precision Haircut", features: ["Classic Scissor Cut", "Modern Styling", "Expert Consultation"], buttons: [{text: "Contact Us", href: "/contact"}]},
+        { id: "pro", badge: "Premium", price: "$75", subtitle: "Full Grooming Experience", features: ["Precision Haircut", "Beard Trim", "Hot Towel Service", "Relaxed Refresh"], buttons: [{text: "Contact Us", href: "/contact"}]},
+        { id: "kids", badge: "Family", price: "$30", subtitle: "Youth Haircut", features: ["Gentle Scissor Cut", "Fast Friendly Service", "Classic Style"], buttons: [{text: "Contact Us", href: "/contact"}]},
       ]}
       title="Quality Service, Transparent Price"
       description="Simple, honest pricing for the services you need."
@@ -143,8 +143,8 @@ export default function LandingPage() {
       <FooterLogoEmphasis
         logoText="Lackawanna Barber Shop"
         columns={[
-          { items: [{ label: "132 Morris St, Morristown, NJ", href: "/contact" }, { label: "+1 (973) 538-1675" }] },
-          { items: [{ label: "Services", href: "#services" }, { label: "Team", href: "#team" }, { label: "FAQs", href: "#faq" }] }
+          { items: [{ label: "132 Morris St, Morristown, NJ", href: "/contact" }, { label: "+1 (973) 538-1675", href: "/contact" }] },
+          { items: [{ label: "Services", href: "/#services" }, { label: "Team", href: "/#team" }, { label: "FAQs", href: "/#faq" }] }
         ]}
       />
   </div>