Mise

About This Template

Mise is a fine-dining restaurant template built for tasting-menu kitchens, chef-led rooms, and hospitality groups. Fourteen pages cover a menu grouped by course with allergen notes and seasonal tags, a chef page, team, a filterable gallery with a keyboard-navigable lightbox, a journal with article pages, press and awards, location, private dining, reservations, and contact. The homepage opens on the Tasting Sequence: a pinned stage whose track slides sideways through three full-viewport course panels and a reservation panel as you scroll, each course name unmasking line by line via GSAP SplitText while the background photograph settles from a 1.08 Ken Burns scale. Five typed content collections, three colour skins, Restaurant JSON-LD, an RSS feed, and an AVIF + WebP pipeline over 34 source photographs.

Signature

The homepage hero is a tasting menu you scroll through. A sticky stage is pinned by ScrollTrigger while its 400vw track slides sideways through three full-viewport course panels and a closing reservation panel, at scrub 1.8 so the motion trails your wheel. Each panel's dish name is split into lines by GSAP SplitText and masked up from beneath an overflow-hidden clip, its number, description and ingredient chips staggering in behind it, while the background photograph eases from scale 1.08 to 1.0. Progress dots track the course you're on; reduced-motion visitors get every panel legible and static.

Features

• 14 pages — Home, Menu, About, Chef, Team, Gallery, Journal, Journal Article, Press, Location, Private Dining, Reservations, Contact, 404
• Tasting Sequence hero — a pinned stage whose track scrolls sideways through 3 full-viewport course panels plus a reservation panel (scrub 1.8)
• GSAP SplitText line-mask reveals per panel, tied to the scrub timeline, with staggered ingredient chips
• Ken Burns parallax — each course photograph eases from scale 1.08 to 1.0 as its panel crosses the viewport
• 5 Zod-typed content collections — journal (4 posts), menu (12 dishes), gallery (14 images), team (6), awards (4)
• Gallery with food/ambiance/kitchen filters and a lightbox driven by Escape and arrow keys, with body scroll lock
• Menu page grouped into six courses, with a 'Contains' allergen line and Seasonal chips from the collection schema
• 3 colour skins — Ivory Kitchen (default), Midnight Tasting and Garden Fresh — set per page via the layout's data-skin prop
• Reservations page with Resy and OpenTable handoffs plus a tel: fallback for phone bookings
• Contact form pointing at PUBLIC_FORM_ENDPOINT — set the env var and it goes live
• Press & awards marquee with hover-to-pause, plus a dedicated press page sorted by year
• Magnetic buttons via a data-magnetic attribute, plus scroll-triggered count-ups on the about page
• Restaurant JSON-LD with address and opening hours on the home page, Article JSON-LD on journal posts
• RSS feed (@astrojs/rss), sitemap, canonical URLs, Open Graph, robots.txt and llms.txt included
• AVIF + WebP dual-format pipeline through getImage() over 34 source photographs
• Lenis smooth scroll with Astro View Transitions — every ScrollTrigger is killed and rebuilt on navigation; prefers-reduced-motion drops the hero to a static state

Deployment