Switch to version 2: modified src/app/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -2,9 +2,9 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactSplit from '@/components/sections/contact/ContactSplit';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
-import FooterSimple from '@/components/sections/footer/FooterSimple';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroBillboard from '@/components/sections/hero/HeroBillboard';
 import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
@@ -181,46 +181,49 @@ export default function LandingPage() {
   </div>
 
   <div id="contact" data-section="contact">
-      <ContactSplit
+      <ContactSplitForm
+      title="Visit Us & Reserve"
+      description="Join us for an authentic Mediterranean experience. Located in the heart of the city, we are open daily to serve you."
+      inputs={[
+        { name: "name", type: "text", placeholder: "Full Name" },
+        { name: "email", type: "email", placeholder: "Email Address" },
+        { name: "phone", type: "tel", placeholder: "Phone Number" }
+      ]}
+      textarea={{ name: "message", placeholder: "Reservation details (Date, time, party size)", rows: 4 }}
+      buttonText="Send Reservation"
       useInvertedBackground={false}
-      background={{ variant: "radial-gradient" }}
-      tag="Visit Us"
-      title="Reserve Your Table"
-      description="Experience Mediterranean hospitality in the heart of the city. We welcome reservations for groups and special events."
-      imageSrc="http://img.b2bpic.net/free-photo/high-angle-safari-party-with-drinks-arrangement_23-2149707887.jpg"
-      mediaAnimation="slide-up"
-      inputPlaceholder="Enter your email for reservation updates"
-      buttonText="Notify Me"
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterSimple
+      <FooterBaseCard
+      logoText="Zaatar Restaurant"
       columns={[
-        {
-          title: "Dining",          items: [
-            { label: "Menu", href: "#menu" },
-            { label: "Reservations", href: "#contact" },
-          ],
+        { 
+            title: "Location", 
+            items: [
+                { label: "123 Mediterranean Ave", href: "#" },
+                { label: "City Center, NY", href: "#" }
+            ]
         },
-        {
-          title: "Company",          items: [
-            { label: "About Us", href: "#about" },
-            { label: "Career", href: "#" },
-          ],
-        },
-        {
-          title: "Support",          items: [
-            { label: "FAQ", href: "#" },
-            { label: "Contact", href: "#contact" },
-          ],
+        { 
+            title: "Hours", 
+            items: [
+                { label: "Mon-Fri: 11am - 10pm", href: "#" },
+                { label: "Sat-Sun: 10am - 11pm", href: "#" }
+            ]
         },
+        { 
+            title: "Contact", 
+            items: [
+                { label: "(555) 123-4567", href: "tel:5551234567" },
+                { label: "contact@zaatar.com", href: "mailto:contact@zaatar.com" }
+            ]
+        }
       ]}
-      bottomLeftText="© 2024 Zaatar Restaurant. All rights reserved."
-      bottomRightText="Privacy Policy"
     />
   </div>
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}