site/src/app/layout.tsx

87 lines
3.3 KiB
TypeScript

import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import Link from "next/link";
import Image from "next/image";
import Script from "next/script";
import { Navigation } from "@/components/layout/Navigation";
import { SubnavBar } from "@/components/layout/SubnavBar";
import InfoBanner from "@/components/layout/InfoBanner";
const inter = Inter({ subsets: ["latin"], variable: "--font-inter" });
export const metadata: Metadata = {
title: "Associação Portuguesa de Powerlifting (APP)",
description:
"Website da APP com acessibilidade WCAG 2.1 AA e suporte bilingue",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="pt" data-theme="light">
<head>
<Script
defer
data-domain="powerlifting.pt"
src="https://plausible.comfy.solutions/js/script.file-downloads.hash.outbound-links.js"
strategy="afterInteractive"
/>
<Script id="plausible-init" strategy="afterInteractive">
{`window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }`}
</Script>
</head>
<body className={`${inter.variable} font-sans antialiased`}>
{/* Skip to main content link */}
<a href="#main-content" className="skip-link">Saltar para o conteúdo</a>
{/* Header Navigation */}
<header className="app-header" role="banner">
<div className="top-accent" aria-hidden="true"></div>
<div className="container flex items-center justify-between py-3">
<Link href="/pt" className="logo" aria-label="Página inicial APP">
<Image
src="/logo.png"
alt="APP — Associação Portuguesa de Powerlifting"
width={240}
height={48}
priority
sizes="(max-width: 768px) 180px, 240px"
/>
</Link>
<Navigation />
</div>
{/* Persistent sub navigation for active section */}
{/* Rendered below via SubnavBar for full-width bar */}
<SubnavBar />
</header>
<InfoBanner />
<main id="main-content" className="container py-6" role="main">
{children}
</main>
<footer className="app-footer" role="contentinfo">
<div className="container py-4">
<div className="footer-main">
<div className="footer-left">
<p>© {new Date().getFullYear()} APP Associação Portuguesa de Powerlifting</p>
<p className="footer-attribution">feito por <a href="https://comfy.solutions" target="_blank" rel="noopener noreferrer">comfy.solutions</a> com &lt;3&nbsp;·&nbsp;<a href="https://forms.fillout.com/t/1rA9gLigcEus" target="_blank" rel="noopener noreferrer">Erros? Informe-nos!</a></p>
</div>
<nav className="footer-links" aria-label="Footer links">
<Link href="/pt/privacidade">Privacidade</Link>
<Link href="/pt/acessibilidade">Declaração de Acessibilidade</Link>
<Link href="/pt/avisos-legais">Avisos Legais</Link>
</nav>
</div>
</div>
</footer>
</body>
</html>
);
}