---
import { ViewTransitions } from "astro:transitions";

interface Props {
  title?: string;
  description?: string;
  hideScrollbar?: boolean;
  themeColor?: string;
}

const { title, description, hideScrollbar, themeColor } = Astro.props;

const fullTitle = `${title ? title + " – " : ""}Mikkel Svartveit`;
---

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="/favicon.png" />
    <meta name="viewport" content="width=device-width" />
    <title>{fullTitle}</title>
    <meta
      name="description"
      content={description ??
        "Hi, I'm Mikkel! I am a Computer Science student from Norway and this is my playground. Here you will find some programming projects, and a small collection of photos I'm proud of."}
    />
    <meta name="theme-color" content={themeColor ?? "#facc15"} />
    <ViewTransitions fallback="none" />
  </head>

  <body class={`bg-gray-50 ${hideScrollbar ? "" : "overflow-y-scroll"}`}>
    <slot />
  </body>
</html>
