---
import Panel from "./Panel.astro";
import "../styles/global.scss";
import { getCollection } from "astro:content";

const { title } = Astro.props;
const pageTitle = title || "FoxGirlRiley's shitty website | Bwaaa 🎺";

const hasPosts = (await getCollection("blog")).length > 0;
---

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/icon.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{pageTitle}</title>
    <link rel="human-json" href="/human.json" />
  </head>
  <body>
    {
      hasPosts && (
        <Panel>
          <span style="display: flex; flex-direction: row; justify-content: space-between; width: 200px;">
            <a href="/">Home</a>
            <a href="/blog/">Blog</a>
          </span>
        </Panel>
      )
    }
    <slot />
  </body>
</html>
