Files
ACVE/components/Footer.tsx
2026-03-15 13:52:11 +00:00

100 lines
4.0 KiB
TypeScript
Executable File

import Image from "next/image";
import Link from "next/link";
const academicLinks = [
{ href: "/courses", label: "Formación Académica" },
{ href: "/case-studies", label: "Casos prácticos" },
{ href: "/practice", label: "Retos" },
{ href: "/eventos", label: "Eventos" },
{ href: "/noticias", label: "Noticias", id: "footer-news" },
{ href: "/comunidad", label: "Comunidad", id: "footer-community" },
];
const institutionalLinks = [
{ href: "/auth/login", label: "Ingresa" },
{ href: "/#footer-contact", label: "Contáctanos" },
{ href: "/sobre-acve", label: "Sobre ACVE", id: "footer-about" },
{ href: "mailto:academico@acve.mx", label: "Retroalimentación", external: true },
];
const legalLinks = [
{ href: "/#privacy", label: "Aviso de Privacidad" },
{ href: "/#terms", label: "Términos y Condiciones" },
];
export default function Footer() {
return (
<footer className="border-t border-border/80 bg-card/95">
<div className="mx-auto w-full max-w-[1300px] px-4 py-12 md:px-6">
<div className="grid gap-10 md:grid-cols-2 xl:grid-cols-[1.4fr_1fr_1fr_1fr]">
<section className="space-y-6">
<Link className="inline-flex items-center gap-3" href="/">
<div className="rounded-xl bg-primary/10 p-2 ring-1 ring-primary/20">
<Image alt="ACVE logo" className="h-10 w-10 rounded-lg object-cover" height={40} src="/images/logo.png" width={40} />
</div>
<div>
<p className="text-xl font-bold tracking-tight text-primary">ACVE Centro de Estudios</p>
<p className="text-sm text-muted-foreground">Empowering Lawyer one word at a time</p>
</div>
</Link>
<div className="space-y-2 text-sm text-muted-foreground" id="footer-contact">
<p className="font-semibold text-foreground">Contacto</p>
<p>Av. José Vasconcelos 345, Torre Tanarah Piso 23, San Pedro, N.L., México.</p>
<p>
Teléfono:{" "}
<a className="text-primary hover:underline" href="tel:+528117789777">
+52-81-17-78-97-77
</a>
</p>
<p>
Correo:{" "}
<a className="text-primary hover:underline" href="mailto:academico@acve.mx">
academico@acve.mx
</a>
</p>
</div>
</section>
<nav className="space-y-3 text-sm">
<p className="font-semibold text-foreground">Navegación</p>
{academicLinks.map((link) => (
<Link key={link.label} className="block text-muted-foreground transition hover:text-primary" href={link.href} id={link.id}>
{link.label}
</Link>
))}
</nav>
<nav className="space-y-3 text-sm">
<p className="font-semibold text-foreground">Institucional</p>
{institutionalLinks.map((link) =>
link.external ? (
<a key={link.label} className="block text-muted-foreground transition hover:text-primary" href={link.href} id={link.id}>
{link.label}
</a>
) : (
<Link key={link.label} className="block text-muted-foreground transition hover:text-primary" href={link.href} id={link.id}>
{link.label}
</Link>
),
)}
</nav>
<nav className="space-y-3 text-sm">
<p className="font-semibold text-foreground">Legal</p>
{legalLinks.map((link) => (
<Link key={link.label} className="block text-muted-foreground transition hover:text-primary" href={link.href} id={link.href.slice(2)}>
{link.label}
</Link>
))}
</nav>
</div>
<div className="mt-10 border-t border-border/70 pt-5 text-xs text-muted-foreground">
<p>© {new Date().getFullYear()} ACVE Centro de Estudios. Todos los derechos reservados.</p>
</div>
</div>
</footer>
);
}