{{ define "base" }}
  {{ $title := "" }}
  {{ $path := "" }}
  {{ if ne nil .NavbarActive }}
    {{ $title = .NavbarActive.Title }}
    {{ $path = .NavbarActive.Path }}
  {{ end }}


  <!doctype html>
  <html lang="en">
    <head>
      <meta charset="UTF-8" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <meta http-equiv="X-UA-Compatible" content="ie=edge" />
      <title>Zdravko - {{ $title }}</title>
      <link rel="stylesheet" href="/static/css/tailwind.css" />
    </head>
    <body class="bg-gray-100 flex flex-col">
      <header
        class="container max-w-screen-md flex flex-col sm:flex-row items-center sm:justify-between p-4 gap-2"
      >
        <a href="/" class="hover:underline text-2xl font-bold"
          >zdravko.mnts.dev</a
        >
        <nav class="navbar flex sm:flex-row flex-col flex-wrap space-x-2 gap-1">
          {{ range .Navbar }}
            <a
              {{ $active := eq .Path $path }}
              {{ if $active }}aria-current="true"{{ end }}
              href="{{ .Path }}"
              class="{{ if $active }}active{{ end }}"
            >
              {{ .Title }}
            </a>
          {{ end }}
        </nav>
      </header>
      {{ template "main" . }}
      <div class="container mx-auto">
        <footer class="text-center text-gray-600 text-xs mt-8 mb-4">
          <a class="hover:underline" href="https://zdravko.mnts.dev"
            >Zdravko {{ Version }}</a
          >
          -
          <a
            class="hover:underline"
            href="https://github.com/mentos1386/zdravko"
            >Open Source</a
          >
          - Made with <span class="text-red-500">❤</span> by
          <a class="hover:underline" href="https://mnts.dev/about"
            >Mentos1386</a
          >
          and
          <a
            class="hover:underline"
            href="https://github.com/mentos1386/zdravko/graphs/contributors"
            >others</a
          >.
        </footer>
      </div>
      <script src="/static/js/htmx.min.js"></script>
    </body>
  </html>
{{ end }}
