83 lines
3.1 KiB
TypeScript
83 lines
3.1 KiB
TypeScript
import { Download, ArrowLeft, ExternalLink } from 'lucide-react';
|
|
import Link from 'next/link';
|
|
|
|
export const metadata = {
|
|
title: 'Términos y Condiciones — Horux 360',
|
|
};
|
|
|
|
const PDF_URL = '/legal/terminos-y-condiciones.pdf';
|
|
|
|
export default function TerminosPage() {
|
|
return (
|
|
<div className="min-h-screen flex flex-col bg-background">
|
|
<header className="sticky top-0 z-10 border-b bg-background/95 backdrop-blur">
|
|
<div className="mx-auto max-w-6xl px-6 py-3 flex items-center justify-between gap-4">
|
|
<Link href="/login" className="flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground">
|
|
<ArrowLeft className="h-4 w-4" />
|
|
Volver
|
|
</Link>
|
|
<h1 className="text-base sm:text-lg font-semibold truncate">Términos y Condiciones</h1>
|
|
<div className="flex items-center gap-3">
|
|
<a
|
|
href={PDF_URL}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="hidden sm:flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground"
|
|
title="Abrir en nueva pestaña"
|
|
>
|
|
<ExternalLink className="h-4 w-4" />
|
|
Abrir
|
|
</a>
|
|
<a
|
|
href={PDF_URL}
|
|
download
|
|
className="flex items-center gap-2 text-sm font-medium text-primary hover:underline"
|
|
>
|
|
<Download className="h-4 w-4" />
|
|
Descargar
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
{/* El PDF se renderiza con el viewer nativo del navegador — preserva
|
|
fuentes, tablas, numeración, listas, todo el formato original. El
|
|
fallback para móviles que no soportan inline PDF aparece abajo. */}
|
|
<main className="flex-1 mx-auto w-full max-w-6xl px-2 sm:px-6 py-4">
|
|
<object
|
|
data={PDF_URL}
|
|
type="application/pdf"
|
|
className="w-full h-[calc(100vh-120px)] min-h-[600px] rounded border"
|
|
aria-label="Términos y Condiciones de Horux 360"
|
|
>
|
|
{/* Fallback: navegadores/móviles sin viewer inline */}
|
|
<div className="p-8 text-center space-y-4">
|
|
<p className="text-muted-foreground">
|
|
Tu navegador no puede mostrar el PDF directamente.
|
|
</p>
|
|
<div className="flex flex-wrap gap-3 justify-center">
|
|
<a
|
|
href={PDF_URL}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="inline-flex items-center gap-2 px-4 py-2 rounded bg-primary text-primary-foreground font-medium hover:bg-primary/90"
|
|
>
|
|
<ExternalLink className="h-4 w-4" />
|
|
Abrir en nueva pestaña
|
|
</a>
|
|
<a
|
|
href={PDF_URL}
|
|
download
|
|
className="inline-flex items-center gap-2 px-4 py-2 rounded border hover:bg-accent"
|
|
>
|
|
<Download className="h-4 w-4" />
|
|
Descargar PDF
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</object>
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|