From 59f2ecc5144fd02891e6eef7c14424d9923e9056 Mon Sep 17 00:00:00 2001 From: bender Date: Tue, 3 Mar 2026 15:15:53 +0000 Subject: [PATCH 1/6] Add src/app/appointment/page.tsx --- src/app/appointment/page.tsx | 253 +++++++++++++++++++++++++++++++++++ 1 file changed, 253 insertions(+) create mode 100644 src/app/appointment/page.tsx diff --git a/src/app/appointment/page.tsx b/src/app/appointment/page.tsx new file mode 100644 index 0000000..42d1c53 --- /dev/null +++ b/src/app/appointment/page.tsx @@ -0,0 +1,253 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import { useState } from "react"; +import Link from "next/link"; +import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline"; +import HeroSplit from "@/components/sections/hero/HeroSplit"; +import ContactSplit from "@/components/sections/contact/ContactSplit"; +import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow"; +import ContactCTA from "@/components/sections/contact/ContactCTA"; +import FooterCard from "@/components/sections/footer/FooterCard"; +import Input from "@/components/form/Input"; +import { Calendar, Clock, Eye, Instagram, Facebook, Linkedin, MapPin } from "lucide-react"; + +export default function AppointmentPage() { + const navItems = [ + { name: "Collections", id: "collections" }, + { name: "Services", id: "services" }, + { name: "About", id: "about" }, + { name: "Contact", id: "contact" }, + ]; + + const navButton = { + text: "Book Appointment", href: "/appointment"}; + + const [formData, setFormData] = useState({ + name: "", email: "", phone: "", date: "", time: "", service: "", message: ""}); + + const handleInputChange = (field: string, value: string) => { + setFormData((prev) => ({ + ...prev, + [field]: value, + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + console.log("Appointment booked:", formData); + // Handle form submission here + }; + + return ( + + {/* Navbar */} + + + {/* Hero Section */} +
+ +
+ + {/* Booking Form Section */} +
+
+
+
+

Schedule Your Appointment

+

Fill out the form below and we'll confirm your appointment shortly

+
+ +
+
+
+ + handleInputChange("name", value)} + placeholder="Your full name" + required + /> +
+
+ + handleInputChange("email", value)} + placeholder="your@email.com" + type="email" + required + /> +
+
+ +
+
+ + handleInputChange("phone", value)} + placeholder="(123) 456-7890" + type="tel" + required + /> +
+
+ + handleInputChange("date", value)} + placeholder="mm/dd/yyyy" + type="date" + required + /> +
+
+ +
+
+ + handleInputChange("time", value)} + placeholder="Select time" + type="time" + required + /> +
+
+ + +
+
+ +
+ +