const { useState, useEffect } = React;
const Logo = ({ size = 'normal' }) => {
const big = size === 'normal';
return (
);
};
const Nav = () => {
const [scrolled, setScrolled] = useState(false);
const [open, setOpen] = useState(false);
useEffect(() => {
const fn = () => setScrolled(window.scrollY > 50);
window.addEventListener('scroll', fn);
return () => window.removeEventListener('scroll', fn);
}, []);
const links = [
['Products', '#products'],
['Track', 'track.html'],
['Loyalty', 'loyalty.html'],
['Reserve', 'reservation.html'],
];
return (
<>
{/* Mobile menu */}
{links.map(([label, href]) => (
setOpen(false)} style={{
color: '#F5F0EB',
fontFamily: "'Space Grotesk', sans-serif",
fontWeight: '600', fontSize: '22px',
textDecoration: 'none', padding: '12px 0',
borderBottom: '1px solid rgba(245,240,235,0.06)',
}}>{label}
))}
ORDER NOW →