48 lines
2.0 KiB
TypeScript
48 lines
2.0 KiB
TypeScript
"use client";
|
|
|
|
import { Container } from "@/components/container";
|
|
import { Heading } from "@/components/heading";
|
|
import { Subheading } from "@/components/subheading";
|
|
import { KleapForm } from "@/components/kleap-form";
|
|
|
|
export function Reservation() {
|
|
const fields = [
|
|
{ name: "name", label: "Full Name", type: "text", required: true, placeholder: "John Doe" },
|
|
{ name: "email", label: "Email Address", type: "email", required: true, placeholder: "john@example.com" },
|
|
{ name: "phone", label: "Phone Number", type: "tel", required: true, placeholder: "+33 1 23 45 67 89" },
|
|
{ name: "date", label: "Date", type: "date", required: true },
|
|
{ name: "time", label: "Time", type: "time", required: true },
|
|
{ name: "guests", label: "Number of Guests", type: "number", required: true, placeholder: "2" },
|
|
{ name: "requests", label: "Special Requests", type: "textarea", required: false, placeholder: "Allergies, special occasion..." },
|
|
];
|
|
|
|
return (
|
|
<section id="reservation" className="py-20 bg-amber-50">
|
|
<Container>
|
|
<div className="grid md:grid-cols-2 gap-12 items-center">
|
|
<div>
|
|
<Heading className="text-4xl font-serif text-stone-900 mb-6">Reserve Your Table</Heading>
|
|
<Subheading className="text-stone-600 mb-8">
|
|
Join us for an unforgettable dining experience. For parties larger than 8, please contact us directly.
|
|
</Subheading>
|
|
<div className="space-y-4 text-stone-700">
|
|
<p><strong>Dress Code:</strong> Smart Casual</p>
|
|
<p><strong>Cancellation Policy:</strong> Please cancel at least 24 hours in advance.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-white p-8 rounded-xl shadow-lg border border-amber-100">
|
|
<KleapForm
|
|
formId="reservation"
|
|
title="Table Reservation"
|
|
fields={fields}
|
|
submitText="Book Now"
|
|
className="space-y-4"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|