;
}
// Navigation
function Nav({ activePage = "home" }) {
const [theme, setTheme] = useTheme();
const [scrolled, setScrolled] = useState(false);
const [open, setOpen] = useState(false);
useEffect(() => {
const on = () => setScrolled(window.scrollY > 20);
on();
window.addEventListener('scroll', on, { passive: true });
return () => window.removeEventListener('scroll', on);
}, []);
const links = [
{ id: "home", href: "index.html", label: "Inicio", ico: "fa-house" },
{ id: "categorias", href: "categorias.html", label: "Categorías", ico: "fa-layer-group" },
{ id: "partidos", href: "index.html#partidos", label: "Partidos", ico: "fa-calendar-days" },
{ id: "galeria", href: "index.html#galeria", label: "Galería", ico: "fa-images" },
{ id: "contacto", href: "contacto.html", label: "Contacto", ico: "fa-envelope" },
// Acceso al panel: socios, delegados, tesorería y administración.
{ id: "socios", href: "panel/", label: "Socios", ico: "fa-lock", externo: true }];
return (
);
}
// Marquesina (ticker de novedades). Texto, colores y velocidad se configuran
// desde el panel. Va en el shell porque se muestra en todas las páginas.
const TICKER_DEFAULT = {
activo: true,
fondo: "#4FB8E6",
texto: "#0B2545",
velocidad: 30,
mensajes: ["INSCRIPCIONES 2026 ABIERTAS", "PRIMERA CLASE DE PRUEBA GRATIS"]
};
function Marquesina() {
const [cfg, setCfg] = useState(TICKER_DEFAULT);
useEffect(() => {
fetch("api/contenido.php", { headers: { Accept: "application/json" } }).
then((r) => r.ok ? r.json() : Promise.reject()).
then((j) => {
if (j && j.ok && j.ticker && Array.isArray(j.ticker.mensajes) && j.ticker.mensajes.length) {
setCfg({ ...TICKER_DEFAULT, ...j.ticker });
} else if (j && j.ok && j.ticker && !j.ticker.activo) {
setCfg({ ...TICKER_DEFAULT, activo: false });
}
}).
catch(() => {});
}, []);
if (!cfg.activo || !cfg.mensajes.length) return null;
const linea = cfg.mensajes.map((m) => "★ " + m).join(" ");
return (