178 lines
5.7 KiB
TypeScript
178 lines
5.7 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { PawPrint, Heart } from 'lucide-react';
|
|
|
|
export default function Footer() {
|
|
return (
|
|
<footer
|
|
style={{
|
|
background: 'var(--color-soil)',
|
|
color: 'var(--color-cream)',
|
|
padding: '48px 0 24px',
|
|
marginTop: 'auto',
|
|
}}
|
|
>
|
|
<div className="container">
|
|
{/* Top row */}
|
|
<div
|
|
style={{
|
|
display: 'grid',
|
|
gridTemplateColumns: '1fr',
|
|
gap: '40px',
|
|
marginBottom: '40px',
|
|
}}
|
|
className="md:grid-cols-3"
|
|
>
|
|
{/* Brand */}
|
|
<div>
|
|
<div style={{ display: 'flex', alignItems: 'center', gap: '8px', marginBottom: '12px' }}>
|
|
<PawPrint size={20} style={{ color: 'var(--color-terra)' }} />
|
|
<span
|
|
style={{
|
|
fontFamily: 'var(--font-playfair, Georgia, serif)',
|
|
fontStyle: 'italic',
|
|
fontWeight: 700,
|
|
fontSize: '20px',
|
|
color: 'var(--color-terra)',
|
|
}}
|
|
>
|
|
PetLink
|
|
</span>
|
|
</div>
|
|
<p
|
|
style={{
|
|
fontFamily: 'var(--font-body)',
|
|
fontSize: '14px',
|
|
lineHeight: 1.7,
|
|
color: 'rgba(250,246,240,0.65)',
|
|
maxWidth: '260px',
|
|
}}
|
|
>
|
|
Conectamos adoptantes, doadores e canis em todo o território português. Cada adopção é uma vida transformada.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Links */}
|
|
<div>
|
|
<p
|
|
style={{
|
|
fontFamily: 'var(--font-mono, monospace)',
|
|
fontSize: '10px',
|
|
letterSpacing: '0.12em',
|
|
textTransform: 'uppercase',
|
|
color: 'rgba(250,246,240,0.4)',
|
|
marginBottom: '16px',
|
|
}}
|
|
>
|
|
Plataforma
|
|
</p>
|
|
<div style={{ display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
|
{[
|
|
{ href: '/main/animals', label: 'Explorar animais' },
|
|
{ href: '/main/donate', label: 'Fazer uma doação' },
|
|
{ href: '/main/shelters', label: 'Canis parceiros' },
|
|
{ href: '/auth/register', label: 'Criar conta' },
|
|
].map(({ href, label }) => (
|
|
<Link
|
|
key={href}
|
|
href={href}
|
|
style={{
|
|
fontFamily: 'var(--font-body)',
|
|
fontSize: '14px',
|
|
color: 'rgba(250,246,240,0.7)',
|
|
textDecoration: 'none',
|
|
transition: 'color 180ms ease',
|
|
}}
|
|
onMouseEnter={e => ((e.target as HTMLElement).style.color = 'var(--color-terra)')}
|
|
onMouseLeave={e => ((e.target as HTMLElement).style.color = 'rgba(250,246,240,0.7)')}
|
|
>
|
|
{label}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
{/* Legal */}
|
|
<div>
|
|
<p
|
|
style={{
|
|
fontFamily: 'var(--font-mono, monospace)',
|
|
fontSize: '10px',
|
|
letterSpacing: '0.12em',
|
|
textTransform: 'uppercase',
|
|
color: 'rgba(250,246,240,0.4)',
|
|
marginBottom: '16px',
|
|
}}
|
|
>
|
|
Legal
|
|
</p>
|
|
<div style={{ display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
|
{[
|
|
{ href: '/privacy', label: 'Política de Privacidade' },
|
|
{ href: '/terms', label: 'Termos de Utilização' },
|
|
{ href: '/rgpd', label: 'RGPD' },
|
|
{ href: '/contact', label: 'Contacto' },
|
|
].map(({ href, label }) => (
|
|
<Link
|
|
key={href}
|
|
href={href}
|
|
style={{
|
|
fontFamily: 'var(--font-body)',
|
|
fontSize: '14px',
|
|
color: 'rgba(250,246,240,0.7)',
|
|
textDecoration: 'none',
|
|
transition: 'color 180ms ease',
|
|
}}
|
|
onMouseEnter={e => ((e.target as HTMLElement).style.color = 'var(--color-terra)')}
|
|
onMouseLeave={e => ((e.target as HTMLElement).style.color = 'rgba(250,246,240,0.7)')}
|
|
>
|
|
{label}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Divider */}
|
|
<div
|
|
style={{
|
|
borderTop: '1px solid rgba(250,246,240,0.1)',
|
|
paddingTop: '24px',
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
gap: '8px',
|
|
alignItems: 'center',
|
|
textAlign: 'center',
|
|
}}
|
|
>
|
|
<p
|
|
style={{
|
|
fontFamily: 'var(--font-body)',
|
|
fontSize: '13px',
|
|
color: 'rgba(250,246,240,0.4)',
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
gap: '6px',
|
|
}}
|
|
>
|
|
Feito com
|
|
<Heart size={12} style={{ color: 'var(--color-terra)', fill: 'var(--color-terra)' }} />
|
|
em Portugal · PetLink © {new Date().getFullYear()}
|
|
</p>
|
|
<p
|
|
style={{
|
|
fontFamily: 'var(--font-mono, monospace)',
|
|
fontSize: '11px',
|
|
color: 'rgba(250,246,240,0.25)',
|
|
letterSpacing: '0.06em',
|
|
}}
|
|
>
|
|
PAP 2024/2025
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|