/* Shared nav + footer + theme toggle. Reads ?theme= from localStorage. */
const NAV_LINKS = [
{ href: 'index.html', label: 'Home', id: 'home' },
{ href: 'tech.html', label: 'Tech', id: 'tech' },
{ href: 'about.html', label: 'About', id: 'about' },
{ href: 'reserve.html', label: 'Back Us', id: 'reserve' },
];
function Nav({ active }) {
const [theme, setTheme] = React.useState(
() => localStorage.getItem('zephyr-theme') || 'light'
);
const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
React.useEffect(() => {
document.documentElement.setAttribute('data-theme', theme);
localStorage.setItem('zephyr-theme', theme);
}, [theme]);
return (
<>
{mobileMenuOpen && (
)}
);
}
function ZephyrMark() {
return (
);
}
function SocialIcon({ href, label, brandColor, children }) {
return (
{
e.currentTarget.style.background = brandColor;
e.currentTarget.style.borderColor = brandColor;
e.currentTarget.style.color = '#fff';
e.currentTarget.style.transform = 'translateY(-4px) scale(1.05)';
e.currentTarget.style.boxShadow = `0 8px 16px ${brandColor}40`;
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = 'var(--card)';
e.currentTarget.style.borderColor = 'var(--line)';
e.currentTarget.style.color = 'var(--fg)';
e.currentTarget.style.transform = 'translateY(0) scale(1)';
e.currentTarget.style.boxShadow = 'none';
}}
>
{children}
);
}
function Footer() {
return (
);
}
window.Nav = Nav;
window.Footer = Footer;