function Nav() {
const [scrolled, setScrolled] = React.useState(false);
const [open, setOpen] = React.useState(false);
const openBookingModal = () => {
let modal = document.getElementById('booking-modal');
if (!modal) {
modal = document.createElement('div');
modal.id = 'booking-modal';
modal.style.cssText = `
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.5); display: flex; align-items: center;
justify-content: center; z-index: 9999;
`;
modal.innerHTML = `
`;
document.body.appendChild(modal);
document.getElementById('modal-close').addEventListener('click', () => {
modal.remove();
});
modal.addEventListener('click', (e) => {
if (e.target === modal) modal.remove();
});
} else {
modal.style.display = 'flex';
}
};
React.useEffect(() => {
const onScroll = () => setScrolled(window.scrollY > 20);
window.addEventListener("scroll", onScroll);
return () => window.removeEventListener("scroll", onScroll);
}, []);
const links = [
{ href: "#about", label: "About" },
{ href: "#how", label: "How it works" },
{ href: "#pricing", label: "Pricing" },
{ href: "#faq", label: "FAQ" },
];
return (
);
}
window.Nav = Nav;