Maison Éclat — Multi-Page Restaurant Website
A four-part restaurant site: glassmorphic navigation, a gradient hero with Chef's Special, a four-category ordering menu with allergen and calorie data wired to a Stripe Payment Link, and native-validation booking and feedback forms.
Preview
What you can customize
Each section below becomes a guided form field in your library after purchase — no prompting experience required.
- 1
Global Layout, Config & Core Assets
Base layer, custom scrollbar and selection colours, the sticky glassmorphic header with dropdown navigation, and the site footer.
2 editable fields
- 2
Home — Hero & Chef's Special Showcase
Full-bleed hero with gradient-clipped headline and dual CTAs, followed by a three-card Chef's Special row with overlay highlights.
2 editable fields
- 3
Menu — Ordering Grid & Stripe Checkout
Four menu categories as card grids with price, calories and allergen indicators, plus static Stripe Payment Link checkout buttons.
2 editable fields
- 4
Reservations & Guest Feedback Forms
Native-validation booking form with date picker, time slots and a party-size slider, plus a guest feedback form with rating and comments.
2 editable fields
Usage instructions
Four segments, generated in order — each one is a standalone block you paste into your own page. 1. Global Layout — the sticky glassmorphic header, dropdown navigation and footer. Do this first; the other three inherit its palette and spacing. 2. Home — hero with gradient-clipped headline, dual CTAs and the Chef's Special row. 3. Menu — four category grids with price, calories and allergen chips, an inline order summary and the Stripe checkout button. 4. Reservations & Feedback — booking form with date picker, time slots and party-size slider, plus a guest feedback form. Two things to know before you publish: STRIPE. The checkout button ships with the placeholder href https://checkout.stripe.com/pay/cs_live_example. It is not a working payment link. Create a Payment Link in your own Stripe dashboard and replace that href before the site goes live. The template deliberately avoids the Stripe JS loader, because AI Tapz's preview sandbox blocks external scripts. FORMS. No backend is included. Both forms post nowhere until you set the action attribute to your own booking or form-handling endpoint. Each block is emitted with Tailwind utility classes plus a matching inline <style> block, so it renders correctly in the AI Tapz preview and drops straight into a Tailwind project without a build step change.
Reviews
No reviews yet — be the first once you've used this template.