<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>{{ page_title }} &raquo; Bit Badger Solutions</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Oswald|Raleway">
    {% page_head -%}
  </head>
  <body hx-boost="true" hx-target="main" hx-indicator="#loadOverlay" hx-swap="innerHTML show:body:top">
    <header class="site-header">
      <div class="header-logo">
        <a href="{{ "" | relative_link }}">
          <img src="{{ "bitbadger.png" | theme_asset }}"
               alt="A cartoon badger looking at a computer screen, with his paw on a mouse"
               title="Bit Badger Solutions">
        </a>
      </div>
      <div class="header-title"><a href="{{ "" | relative_link }}">Bit Badger Solutions</a></div>
      <div class="header-spacer"> &nbsp; </div>
      <div class="header-social">
        <a href="https://twitter.com/Bit_Badger" title="Bit_Badger on Twitter" target="_blank">
          <img src="{{ "twitter.png" | theme_asset }}" alt="Twitter">
        </a> &nbsp;
        <a href="https://www.facebook.com/bitbadger.solutions" title="Bit Badger Solutions on Facebook" target="_blank">
          <img src="{{ "facebook.png" | theme_asset }}" alt="Facebook">
        </a>
      </div>
    </header>
    <div class="load-overlay" id="loadOverlay"><h1>Loading&hellip;</h1></div>
    <main>{{ content }}</main>
    <footer hx-boost="false">
      <div>
        <small>
          {% if logged_on -%}
            <a href="{{ "admin/dashboard" | relative_link }}">Dashboard</a> ~
            <a href="{{ "user/log-off" | relative_link }}">Log Off</a>
          {% else %}
            <a href="{{ "user/log-on" | relative_link }}">Log On</a>
          {% endif %}
        </small>
      </div>
      <div class="footer-by">
        A <strong><a href="{{ "" | relative_link }}">Bit Badger Solutions</a></strong> original design
      </div>
    </footer>
    {% page_foot %}
  </body>
</html>