{{define "base"}}
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    {{block "vite" .}} {{end}}
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta
      name="description"
      content="DyeForYarn GmbH. Color your lace - High Quality Yarn in vivid colors"
    />
    <meta name="author" content="LIKWID Software" />

    <title>{{.Title}}</title>
    <link rel="icon" type="image/x-icon" href="/favicon.ico" />
    <link href="/static/css/bootstrap.min.css" rel="stylesheet" />
    <link href="/static/css/bootstrap-icons.min.css" rel="stylesheet" />
    <link href="/static/css/app.css" rel="stylesheet" />
    {{block "stylesheets" .}} {{end}}
  </head>
  <body class="site">
    <nav
      id="navbar-main"
      class="navbar navbar-expand-lg fixed-top navbar-light bg-white"
      role="navigation"
    >
      <a class="navbar-brand page-scroll" href="#page-top">
        <img alt="Brand" src="/static/img/logo-small.png" />
        DyeForYarn
      </a>
      <button
        type="button"
        class="navbar-toggler"
        data-toggle="collapse"
        data-target="#navbarNav"
        aria-controls="navbarNav"
        aria-expanded="false"
        aria-label="Toggle navigation"
      >
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse" id="navbarNav">
        {{block "navigation" .}} {{end}}
      </div>
    </nav>

    {{block "header" .}} {{end}}

    <main>
      <div class="container site-content">{{block "content" .}} {{end}}</div>
    </main>

    {{block "footer" .}}
    <footer class="site-footer bg-light">
      <ul class="footer-list">
        <li class="footer-list-item">Copyright &copy; DyeForYarn</li>
        <li class="footer-list-item">
          <a
            class="link-secondary fs-5"
            href="/imprint"
            title="Imprint"
            rel="nofollow"
            >Imprint</a
          >
        </li>
        <li class="footer-list-item">
          <a
            class="link-secondary fs-5"
            href="/privacy"
            title="Privacy Policy"
            rel="nofollow"
            >Privacy Policy</a
          >
        </li>
      </ul>
    </footer>
    {{end}} {{block "javascript" .}}
    <script src="/static/js/bootstrap.min.js"></script>
    {{end}}
  </body>
</html>
{{end}}
