import type { Metadata } from "next";
import "./globals.css";
import { Footer } from "@/components/Footer";
import { Nav } from "@/components/Nav";
import { ThemeScript } from "@/components/ThemeScript";

export const metadata: Metadata = {
    metadataBase: new URL("https://vantage.hostxtra.co.uk"),
    title: {
        default: "Vantage: one place to manage every server you look after",
        template: "%s · Vantage",
    },
    description: "Manage access to your servers, run your scripts, check your services are up, store your passwords and open a terminal in the browser. Host it yourself or let us host it.",
    openGraph: {
        type: "website",
        siteName: "Vantage",
        title: "Vantage: one place to manage every server you look after",
        description: "Server access, scripts, uptime checks, stored passwords and a terminal in the browser. Host it yourself or let us host it.",
    },
    icons: { icon: "/images/vantage_logo.svg" },
};

export default function RootLayout({ children }: { children: React.ReactNode }) {
    return (
        <html lang="en-GB">
            <head>
                <ThemeScript />
            </head>
            <body>
                <a className="skip" href="#main">
                    Skip to content
                </a>
                <Nav />
                <main id="main">{children}</main>
                <Footer />
            </body>
        </html>
    );
}
