Update src/app/reserve/page.tsx

Merge version_3 into main

src/app/page.tsx

@@ -37,7 +37,7 @@ export default function LandingPage() {
         {
           name: "Reviews",          id: "reviews"},
         {
-          name: "Reserve",          id: "reserve"},
+          name: "Reserve",          id: "/reserve"},
       ]}
       brandName=""
     />
@@ -51,7 +51,7 @@ export default function LandingPage() {
       description="Experience the timeless elegance of traditional Indian cuisine, reimagined for the modern palate."
       buttons={[
         {
-          text: "Reserve a Table",          href: "#contact"},
+          text: "Reserve a Table",          href: "/reserve"},
       ]}
       carouselItems={[
         {
@@ -160,7 +160,7 @@ export default function LandingPage() {
       text="Join us for an unforgettable evening. Located at Jatheri Rd, Sector 35, Sonipat, Haryana 131001. Open 5pm-11pm."
       buttons={[
         {
-          text: "Reserve Now",          href: "tel:+1234567890"},
+          text: "Reserve Now",          href: "/reserve"},
         {
           text: "Order via Swiggy",          href: "https://swiggy.com"},
       ]}
@@ -174,11 +174,11 @@ export default function LandingPage() {
         {
           title: "Navigation",          items: [
             {
-              label: "About",              href: "#about"},
+              label: "About",              href: "/#about"},
             {
-              label: "Menu",              href: "#menu"},
+              label: "Menu",              href: "/#menu"},
             {
-              label: "Contact",              href: "#contact"},
+              label: "Contact",              href: "/#contact"},
           ],
         },
         {

src/app/reserve/page.tsx

@@ -0,0 +1,65 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { useState } from "react";
+import ContactText from '@/components/sections/contact/ContactText';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+
+export default function ReservePage() {
+  const [name, setName] = useState("");
+  const [date, setDate] = useState("");
+
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Reserve", id: "/reserve" }
+          ]}
+          brandName="Saffron & Silk"
+        />
+      </div>
+      <main className="min-h-screen py-20 flex flex-col items-center justify-center">
+        <div className="max-w-md w-full p-8 bg-card rounded-lg shadow-lg">
+          <h1 className="text-3xl font-bold mb-6 text-foreground">Reserve a Table</h1>
+          <form className="flex flex-col gap-4" onSubmit={(e) => { e.preventDefault(); alert("Reservation requested!"); }}>
+            <input 
+              className="p-3 rounded border bg-background text-foreground" 
+              placeholder="Your Name" 
+              value={name} 
+              onChange={(e) => setName(e.target.value)} 
+              required 
+            />
+            <input 
+              type="date" 
+              className="p-3 rounded border bg-background text-foreground" 
+              value={date} 
+              onChange={(e) => setDate(e.target.value)} 
+              required 
+            />
+            <button type="submit" className="p-3 bg-primary-cta text-white rounded font-bold hover:opacity-90">Confirm Reservation</button>
+          </form>
+        </div>
+      </main>
+      <div id="footer" data-section="footer">
+        <FooterBaseCard 
+          logoText="Saffron & Silk" 
+          columns={[]} 
+        />
+      </div>
+    </ThemeProvider>
+  );
+}