import type { Metadata } from "next";
import { ReactNode } from "react";
import { Header } from "./header";
import { Footer } from "./footer";
import TopLoader from "nextjs-toploader";
import Providers from "./providers";
import "./globals.css";
import { ubuntu } from "./fonts";



export const metadata: Metadata = {
  title: {
    default: "Honey Scamps | Cool Stuff by Cool People",
    template: "%s • Honey Scamps",
  },
  description:
    "Cool stuff by cool people",
};

interface Props {
  children: ReactNode;
}

export default function Layout(props: Props) {
  return (
    <html lang="en" className="light">
      <body className={ubuntu.className}>
        <TopLoader color="orange" />
        <Providers>
          <Header />
          <main>{props.children}</main>
          <Footer />
        </Providers>
      </body>
    </html>
  );
}
