bonamin
ffaeab136d
Rebuild the public-facing digital menu from the design handoff bundle. Matches high-fidelity spec: Bricolage Grotesque + Hanken Grotesk fonts, cream/green/gold palette, per-category tinted panels, product cards with gradient art, tag icon badges, bottom-sheet product detail, search overlay, cart → checkout bottom-sheet flow posting to real API, floating cart button with bump animation, and restyled order-confirm page. - New: src/components/primitives.jsx (DishArt, Badge, DietChip, TagIcons, Price, DiscountFlag, Stepper, price helpers) - Rewrite: MenuPage.jsx — all screens in one component tree, API-driven, lang toggle (EN/GR) persisted to localStorage, scroll-spy category bar - Rewrite: OrderConfirm.jsx — design-system styling, brand colors - Update: App.jsx — remove /order route (cart flow is now a bottom sheet) - Update: tailwind.config.js — font families, brand tokens, animations - Update: index.html — Google Fonts for Bricolage Grotesque + Hanken Grotesk - Delete: CartPage, ProductModal, ProductCard, CategoryNav, CartButton Cart checkout POSTs to real submitOrder API and redirects to /confirm/:ref for live order status polling. Restaurant info falls back to hardcoded placeholder until backend includes it in the fetchMenu response (see REWORK_REVISIT.md). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
53 lines
1.4 KiB
JavaScript
53 lines
1.4 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
export default {
|
|
content: ['./index.html', './src/**/*.{js,jsx}'],
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
display: ['Bricolage Grotesque', 'serif'],
|
|
sans: ['Hanken Grotesk', 'system-ui', 'sans-serif'],
|
|
},
|
|
colors: {
|
|
brand: {
|
|
dark: '#2d3b2d',
|
|
hover: '#26331f',
|
|
},
|
|
cream: '#faf7f0',
|
|
card: '#fcfbf7',
|
|
gold: '#c9a24b',
|
|
terracotta: '#c2602f',
|
|
sage: '#9caf88',
|
|
success: '#3f7d4e',
|
|
},
|
|
borderRadius: {
|
|
card: '20px',
|
|
section: '22px',
|
|
sheet: '24px',
|
|
},
|
|
boxShadow: {
|
|
card: '0 5px 16px -10px rgba(45,42,31,0.45)',
|
|
'card-hover': '0 10px 24px -12px rgba(45,42,31,0.5)',
|
|
cart: '0 12px 28px -8px rgba(45,59,45,0.55)',
|
|
},
|
|
keyframes: {
|
|
fade: { from: { opacity: 0 }, to: { opacity: 1 } },
|
|
slideup: {
|
|
from: { transform: 'translateY(100%)' },
|
|
to: { transform: 'translateY(0)' },
|
|
},
|
|
pop: {
|
|
'0%': { transform: 'scale(1)' },
|
|
'50%': { transform: 'scale(1.06)' },
|
|
'100%': { transform: 'scale(1)' },
|
|
},
|
|
},
|
|
animation: {
|
|
fade: 'fade 0.2s ease',
|
|
slideup: 'slideup 0.28s cubic-bezier(0.22,1,0.36,1)',
|
|
pop: 'pop 0.32s ease',
|
|
},
|
|
},
|
|
},
|
|
plugins: [],
|
|
}
|