{"slug":"covers","name":"Covers – Restaurant & Dining Room","version":"1.6.2","category":"local business","priceCents":1400,"description":"Covers is a restaurant website template for Tailwind and React, built for the agency putting a client's dining room online on a fixed fee. Its signature is the room plan: a schematic top-down drawing of the dining room computed from the theme's single fixture file, so covers, tonight's service, which tables book online and whether the accessible WC is reachable without a step are drawn rather than asserted. The plan is drawn at two scales that are exactly a factor of two apart, and the type ladder is built on the same interval, so the heading beside a doubled drawing is itself doubled. The fiction is Rivelin, a 46-cover neighbourhood dining room and wine bar on the ground floor of a former cutlery works in Sheffield. Its card carries 41 items and nine wines by the glass, with a 46-character dish name, one item priced on the day and one off tonight, because a menu component that only survives six short dishes has not been tested. The palette is a near-white page with the drawing on its own chalk-blue drafting sheet and a deep olive ink, 85 tokens across light and dark, authored in OKLCH and verified pair by pair. The hero sets the working print of the plan over a photograph of the room it draws, and the photography is the theme's own: two shoots, four daylight room shots with four overhead dish plates, and a second after-dark set of five that gives /visit the building from the street, the way in and the room under its own lights, all generated for this theme and licensed with it. Six routes ship: the home page, the card, the room, booking, visiting, and a living styleguide that renders every one of the 37 components in a labelled frame. Three things are configurable in one file and both states of each ship — the room figure as the plan or as four generated room photographs, the menu index by service or by course, and booking as a local request control or a handoff to the client's existing provider. The booking form is honest: it offers only the service windows the fixture has, greys the days the kitchen is shut, refuses a date it is closed on, switches to a snug enquiry above the largest bookable table, and hands the request to one documented adapter seam instead of faking a confirmation.","summary":"For the agency putting a client's dining room online: a restaurant website template tailwind react with menus, a booking request and the room drawn to scale.","tags":["restaurant website template tailwind react","restaurant nextjs template","tailwind restaurant menu template","next.js reservation website template","dining room website template","wine bar website template"],"accent_mode":"second-hue","palette":{"bg":"#e9eff3","surface":"#ffffff","accent":"#6f1a5d","text":"#0d1b24","line":"#b4c5d0"},"darkMode":true,"pages":[{"path":"/","title":"Rivelin: 46 covers, drawn to scale","sections":["site-header","hero","service-tonight","house-note","room-summary","booking-seam","site-footer"]},{"path":"/menus","title":"The card: 41 dishes, indexed by service","sections":["site-header","service-index","card-full","set-menus","wine-list","suppliers-note","site-footer"]},{"path":"/room","title":"The room: 46 covers across four sections","sections":["site-header","room-plan","private-hire","access-statement","booking-seam","site-footer"]},{"path":"/book","title":"Request a table, or take the snug","sections":["site-header","booking-request","booking-handoff","booking-notes","site-footer"]},{"path":"/visit","title":"Opening hours, exceptions and step-free access","sections":["site-header","arrival-plate","week-grid","dated-exceptions","getting-here","night-table","site-footer"]},{"path":"/components","title":"The parts","sections":["site-header","tokens","ui","site-footer"]}],"components":[{"name":"site-header","file":"src/components/site-header.tsx","renders":"Masthead with the brand mark, four nav routes in the order that keeps the two plan openers non-consecutive, tonight's service read from the fixture, the primary booking action, a native details disclosure below lg and the skip link"},{"name":"site-footer","file":"src/components/site-footer.tsx","renders":"Address, phone, the four services with their derived day ranges and hours, the closed day computed from the services array, route links and the type colophon, on the sunken recess"},{"name":"hero","file":"src/components/hero.tsx","renders":"Hero archetype A5, hard 50/50: the room stated plainly beside the window photograph with the working print of the plan pinned over its lower corner, marked for tonight's service, with covers by section, the online party cap and one primary action"},{"name":"service-tonight","file":"src/components/service-tonight.tsx","renders":"Six dishes from tonight's own card sections chosen by rule, beside a service card carrying hours, last seating, dish count and what is off tonight, on a 7/5 split"},{"name":"house-note","file":"src/components/house-note.tsx","renders":"The story band that carries the cut /about route: three paragraphs in the house register with the floor area and the set-menu reduction derived, prose measure on a full-bleed sunken field"},{"name":"room-summary","file":"src/components/room-summary.tsx","renders":"The four room sections as hairline-ruled rows with covers, table count and whether each books online, beside the access and private-hire facts, on an 8/4 split"},{"name":"booking-seam","file":"src/components/booking-seam.tsx","renders":"The closing action with cost, risk and effort answered beside it, the next service and the phone number for a party over the online cap"},{"name":"service-index","file":"src/components/service-index.tsx","renders":"Variant axis 2: the four-band service strip running to both gutters with days, hours, dish count and covers per band, or the same strip inverted to five course columns"},{"name":"card-full","file":"src/components/card-full.tsx","renders":"The whole card — 41 items across five sections on a 46ch measure — beside an aside naming what is new, what is off and what is priced on the day, on a 7/5 split"},{"name":"set-menus","file":"src/components/set-menus.tsx","renders":"Three set menus whose per-head prices are summed from the card and reduced once, on the sunken recess; a composed item priced on the day throws rather than guessing"},{"name":"wine-list","file":"src/components/wine-list.tsx","renders":"Nine wines by the glass grouped by colour with tabular glass and bottle prices, the one surface in the theme where figures are compared down a column"},{"name":"suppliers-note","file":"src/components/suppliers-note.tsx","renders":"The sourcing footnote that carries the cut /story route, at the prose measure"},{"name":"room-plan","file":"src/components/room-plan.tsx","renders":"The plan at exactly 1120px — twice the hero's 560 — beside a d4 heading that is twice the hero's d2, with capacity by section and a key to the drawing on an 8/4 split"},{"name":"private-hire","file":"src/components/private-hire.tsx","renders":"Seated, standing and minimum-spend figures for the snug beside its four-course menu at a price computed from the card, on a 7/5 split"},{"name":"access-statement","file":"src/components/access-statement.tsx","renders":"The plan's access facts written out — entrance, the 120mm step and its rise, the accessible WC and the step-free route — each generated from the same room feature the drawing uses"},{"name":"booking-request","file":"src/components/booking-request.tsx","renders":"Variant axis 3 plus deterministic invalid, closed-day, dated-exception, over-cap enquiry and seam-receipt panes, all derived from the fixture; submitting stays dropped until onSubmit is wired"},{"name":"booking-handoff","file":"src/components/booking-handoff.tsx","renders":"Variant axis 3, second state: the room's own hours and online cap stated first, then a link out to the client's booking provider, with no client JavaScript"},{"name":"booking-notes","file":"src/components/booking-notes.tsx","renders":"The five questions asked before the form is sent — party size, wheelchair access, allergies, closed dates and the phone — answered on the same page, on the sunken recess"},{"name":"arrival-plate","file":"src/components/arrival-plate.tsx","renders":"The after-dark opening band on /visit: the building from Ball Street at night running to both gutters, with tonight's service, the postcode and the entrance read from the fixture on an opaque plate pinned over its lower edge"},{"name":"night-table","file":"src/components/night-table.tsx","renders":"The closing band on /visit: the room under its own lights running to both gutters, with the service hours, last seating and off-tonight count derived, and the route's one primary action beside them"},{"name":"week-grid","file":"src/components/week-grid.tsx","renders":"Seven day columns run to the gutters with every service laid against a derived time axis, closed days struck through and named, scrolling inside its own frame below lg, on a 9/3 split"},{"name":"dated-exceptions","file":"src/components/dated-exceptions.tsx","renders":"The four dated exceptions to the weekly pattern, each striking through what the grid draws and printing what actually runs, from the same array the booking form reads"},{"name":"getting-here","file":"src/components/getting-here.tsx","renders":"Address, phone, email and four travel notes from the fixture, beside the 400px plan with its step-free route overlay on a 7/5 split, closing on the three-frame arrival sequence with the door's line read from the entrance feature"},{"name":"ui/plan","file":"src/components/ui/plan.tsx","renders":"The signature: a schematic top-down plan of the dining room, geometry computed from the room fixture, with service marking, party filtering, bookability, capacity labels, private-hire highlight and the step-free route as composable overlays, at 400, 560 and 1120px, with reversed labels on marked tables and a reduced label set below lg"},{"name":"ui/room-figure","file":"src/components/ui/room-figure.tsx","renders":"Variant axis 1: the same slot rendered as the drawn plan or as the four room photographs with their capacity annotations on full-opacity card plates, both reading the same room fixture"},{"name":"ui/button","file":"src/components/ui/button.tsx","renders":"Primary, plate and quiet variants with hover, active, pressed, pending and disabled states on the computed lightness ramp"},{"name":"ui/field","file":"src/components/ui/field.tsx","renders":"Label, a persistent description, the native control and one message line whose ids and precedence the library derives; the description keeps its place behind the error rather than being written over by it, and the message pairs a glyph with its ink at every verdict"},{"name":"ui/item","file":"src/components/ui/item.tsx","renders":"The item unit: dish name in the display face, ingredient line in italic, the figure riding the end of that line in tabular mono and never in a price column, with diet marks and the off-tonight and new-this-week states, on a 46ch measure"},{"name":"ui/badge","file":"src/components/ui/badge.tsx","renders":"Eyebrow, diet mark (its short code and its accessible name, no glyph), item mark (off tonight, new this week), status mark and neutral fact tag, each with a word beside the colour"},{"name":"ui/section-heading","file":"src/components/ui/section-heading.tsx","renders":"Eyebrow, heading and lede as one stack at three display variants, with a sunken surface policy that lifts supporting copy to --foreground"},{"name":"ui/container","file":"src/components/ui/container.tsx","renders":"The page's three measures — default, prose and full — so a page can put two of them beside each other"},{"name":"ui/logo","file":"src/components/ui/logo.tsx","renders":"The brand mark: the plan's own floorplate with its cut corner and one table, on the drawing's hairline language"},{"name":"ui/type","file":"src/components/ui/type.ts","renders":"The 1.414 type ladder and the shared display, mono, numeral, radius, focus and transition class strings"},{"name":"ui/plate","file":"src/components/ui/plate.tsx","renders":"The information card wearing the drawing's conventions: a thick-thin head rule and a mono title row with one derived figure, over hairline-divided body rows."},{"name":"ui/form","file":"src/components/ui/form.tsx","renders":"The submit flow the booking control runs on: constraint attributes the browser still reads with the script off, one sentence per control per constraint, more than one refusal sent to the summary and exactly one straight to that control, and a receipt that exists before focus is moved to it"},{"name":"ui/form-error-summary","file":"src/components/ui/form-error-summary.tsx","renders":"The critical panel a refused submit lands on, inserted rather than revealed: it counts the answers still needed in words and gives each one a row that names the field, says what is wrong with it and jumps to the control"},{"name":"ui/accordion-disclosure","file":"src/components/ui/accordion-disclosure.tsx","renders":"Two designs on one native details element — the question row with its marker leading and its words in the display face, and the masthead's compact nav panel — both gaining the row the element does not give: Escape from inside collapses the panel and puts focus back on its summary"},{"name":"ui/mode-toggle","file":"src/components/ui/mode-toggle.tsx","renders":"Light and dark from inside the theme, in both editions: the root resolved as the nearest theme scope so an embedded preview is never overruled, a MutationObserver keeping aria-pressed honest when the host flips the mode, both mode classes swapped together, and one accessible name that never contradicts itself"},{"name":"ui/structured-data","file":"src/components/ui/structured-data.tsx","renders":"Restaurant and Menu JSON-LD derived from the same fixture the visible page reads — the address, four services as opening-hours entries, four dated exceptions as special-hours overrides including the closed days, and all 41 card items with their prices and dietary marks. No ratings, no invented coordinates, no FAQ markup, and no reservation action while booking is a request"}],"tokens":{"--background":"#e9eff3","--foreground":"#0d1b24","--card":"#ffffff","--card-foreground":"#0d1b24","--surface-sunken":"#d8e2ea","--surface-raised":"#ffffff","--surface-overlay":"#ffffff","--shadow-color":"#0b1217","--primary":"#383800","--primary-foreground":"#ffffff","--primary-hover":"#282900","--primary-active":"#1a1a00","--primary-tone":"#595901","--secondary":"#d9e5ec","--secondary-foreground":"#0d1b24","--secondary-hover":"#cbdae4","--secondary-active":"#bdd0dc","--muted":"#e0e9ee","--muted-foreground":"#303f49","--accent":"#6f1a5d","--accent-foreground":"#ffffff","--accent-tone":"#8f2c79","--border":"#b4c5d0","--border-strong":"#5c7080","--ring":"#383800","--field":"#ffffff","--field-border":"#9fb4c1","--control-border":"#526879","--selection":"#e8d3e2","--selection-foreground":"#0d1b24","--selection-border":"#8f2c79","--link":"#6f1a5d","--link-hover":"#5d024c","--positive":"#004a24","--positive-foreground":"#ffffff","--positive-soft":"#cfe6d8","--positive-border":"#4a7a5c","--warning":"#5d3500","--warning-foreground":"#ffffff","--warning-soft":"#f2e2c8","--warning-border":"#8a6a35","--critical":"#6d0b12","--critical-foreground":"#ffffff","--critical-soft":"#f3d7d6","--critical-border":"#a1564f","--info":"#1a3f78","--info-foreground":"#ffffff","--info-soft":"#d8e2f3","--info-border":"#5673a5","--plan-ink":"#7792a3","--plan-grid":"#b7cad7","--plan-structure":"#2c3d49","--plan-paper":"#e8eff4","--plan-field":"#d3e0e9","--plan-mark":"#2f3e49","--plan-mark-soft":"#9db7c7","--plan-route":"#8f2c79","--plan-label":"#303f49","--plan-stroke":"1px","--weight-display":"400","--weight-plan-label":"500","--tracking-d1":"-0.01em","--tracking-d2":"-0.01em","--tracking-d3":"-0.02em","--tracking-d4":"-0.025em","--radius":"0.875rem","--radius-inner":"0.5rem","--text-caption":"0.75rem","--leading-caption":"1.4","--text-small":"0.875rem","--leading-small":"1.45","--text-body":"1rem","--leading-body":"1.55","--text-lead":"1.125rem","--leading-lead":"1.6","--text-d1":"1.5rem","--leading-d1":"1.25","--text-d2":"2.121rem","--leading-d2":"1.16","--text-d3":"clamp(2.121rem, 1.757rem + 1.554vw, 3rem)","--leading-d3":"1.1","--text-d4":"clamp(2.625rem, 1.954rem + 2.861vw, 4.243rem)","--leading-d4":"1.05","--tracking-label":"0.08em","--font-display":"var(--font-covers-display), ui-serif, Georgia, serif","--font-text":"var(--font-covers-text), ui-sans-serif, system-ui, sans-serif","--font-sans":"var(--font-text)","--font-mono":"var(--font-covers-mono), ui-monospace, 'Courier New', monospace","--plan-mark-live":"#595901","--plan-live-soft":"#cfcf9a"},"tokensDark":{"--background":"#121f27","--foreground":"#dfeaf0","--card":"#213039","--card-foreground":"#dfeaf0","--surface-sunken":"#060d12","--surface-raised":"#2a3b45","--surface-overlay":"#2d3f48","--shadow-color":"#030608","--primary":"#c0c251","--primary-foreground":"#121f27","--primary-hover":"#d4d65b","--primary-active":"#e6e988","--primary-tone":"#979828","--secondary":"#2c3d47","--secondary-foreground":"#dfeaf0","--secondary-hover":"#354955","--secondary-active":"#3f5563","--muted":"#2b3a44","--muted-foreground":"#9dacb5","--accent":"#d78bc1","--accent-foreground":"#121f27","--accent-tone":"#d78bc1","--border":"#344652","--border-strong":"#6e8290","--ring":"#c0c251","--field":"#090f13","--field-border":"#3c505d","--control-border":"#788c9a","--selection":"#3d2338","--selection-foreground":"#dfeaf0","--selection-border":"#d78bc1","--link":"#d78bc1","--link-hover":"#eb9ed4","--positive":"#6dc88f","--positive-foreground":"#062012","--positive-soft":"#14301f","--positive-border":"#4a8a63","--warning":"#eaad64","--warning-foreground":"#241500","--warning-soft":"#37260f","--warning-border":"#96702f","--critical":"#ed756e","--critical-foreground":"#2a0705","--critical-soft":"#3f1a18","--critical-border":"#b05d55","--info":"#8fb4ee","--info-foreground":"#0a1932","--info-soft":"#182a40","--info-border":"#5c80b5","--plan-ink":"#7d919e","--plan-grid":"#1b2830","--plan-structure":"#c4d2da","--plan-paper":"#101c25","--plan-field":"#060d12","--plan-mark":"#c4d2da","--plan-mark-soft":"#293a45","--plan-route":"#d78bc1","--plan-label":"#9dacb5","--plan-stroke":"1px","--weight-display":"400","--weight-plan-label":"400","--tracking-d1":"-0.005em","--tracking-d2":"-0.005em","--tracking-d3":"-0.015em","--tracking-d4":"-0.02em","--radius":"0.875rem","--radius-inner":"0.5rem","--text-caption":"0.75rem","--leading-caption":"1.4","--text-small":"0.875rem","--leading-small":"1.45","--text-body":"1rem","--leading-body":"1.55","--text-lead":"1.125rem","--leading-lead":"1.6","--text-d1":"1.5rem","--leading-d1":"1.25","--text-d2":"2.121rem","--leading-d2":"1.16","--text-d3":"clamp(2.121rem, 1.757rem + 1.554vw, 3rem)","--leading-d3":"1.1","--text-d4":"clamp(2.625rem, 1.954rem + 2.861vw, 4.243rem)","--leading-d4":"1.05","--tracking-label":"0.08em","--font-display":"var(--font-covers-display), ui-serif, Georgia, serif","--font-text":"var(--font-covers-text), ui-sans-serif, system-ui, sans-serif","--font-sans":"var(--font-text)","--font-mono":"var(--font-covers-mono), ui-monospace, 'Courier New', monospace","--plan-mark-live":"#979828","--plan-live-soft":"#3d3d10"},"compatibility":{"next":">=15 <17","react":">=19 <20","tailwind":">=4 <5"},"dependencies":["lucide-react"],"editions":{"react":{"source":"src","runtime":"react"},"html":{"source":"html/src","output":"html/dist","engine":"nunjucks","runtime":"vanilla","buildRequired":false}},"ui_library":{"version":"1.5.2","files":["html/src/js/_tt/accordion-disclosure.js","html/src/js/_tt/field-ids.js","html/src/js/_tt/form-error-summary.js","html/src/js/_tt/form.js","html/src/js/_tt/pending.js","src/components/ui/_tt/accordion-disclosure.axes.ts","src/components/ui/_tt/accordion-disclosure.fixtures.ts","src/components/ui/_tt/accordion-disclosure.tsx","src/components/ui/_tt/capture.ts","src/components/ui/_tt/field-ids.ts","src/components/ui/_tt/field.axes.ts","src/components/ui/_tt/field.capture.ts","src/components/ui/_tt/field.fixtures.ts","src/components/ui/_tt/field.tsx","src/components/ui/_tt/form-error-summary.axes.ts","src/components/ui/_tt/form-error-summary.fixtures.ts","src/components/ui/_tt/form-error-summary.tsx","src/components/ui/_tt/form.axes.ts","src/components/ui/_tt/form.fixtures.ts","src/components/ui/_tt/form.part.tsx","src/components/ui/_tt/form.ts","src/components/ui/_tt/ids.ts","src/components/ui/_tt/recipe.ts"]},"license":"standard","design":{"typefaces":{"display":"Young Serif","text":"Work Sans","mono":"DM Mono"},"typeRatio":1.414,"signature":"The room plan: a schematic top-down drawing of the dining room whose geometry, covers, section totals, online party cap and step-free route are all computed from the same fixture that sets the card. It recurs on /, /menus, /room and /book, at 560px in the hero and exactly 1120px on /room, so the doubling in the drawing and the doubling in the type ladder are the same interval.","undertone":"near-white page, H 236.6 at L 0.949; the chalk-blue drafting stock survives as the plan's own sheet (--plan-field) and the page's bands","heroArchetype":"A5","surface_kind":"marketing","built_against":"2026-08-28","levers":{"theme":"light","density":"comfortable","accent_mode":"single-saturated","motion":"still","borders":"hairline","radius":"generous","texture":"none","shadow":"none"},"icons":{"set":"lucide","stroke":2,"ladder":["size-3.5","size-4","size-5"],"contexts":{"nav":"glyph","panel_header":"mark","fact_row":"none","feature_grid":"none"}},"disclosure":{"helper_line":"one-clause","sentence":"hint","paragraph":"details","parallel_views":"tabs","secondary_object":"drawer"},"cta":{"header":"quiet","hero":"filled","repeats":["fold","end"],"mobile":"inline"},"colour_budget":{"brand_max_pct":null,"concentration_pct":70,"regions":[]}}}