<!DOCTYPE html>
<html>
  <head>
    <title>{{ post.title }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="/css/github-markdown.css" />
    <link href="/css/beer.min.css" rel="stylesheet" />
    <link href="/css/site.css" rel="stylesheet" />
    <script src="/js/lightense.min.js"></script>
    <script src="/js/post.js"></script>
    <script src="/js/site.js"></script>
  </head>

  <body class="dark">
    <nav class="bottom no-margin">
      <a href="/{{ post.previous }}" id="previous">
        <i>arrow_back</i>
        <div>Previous</div>
      </a>
      <a href="" onclick="changeMode()">
        <i>light_mode</i>
        <div>Mode</div>
      </a>
      <a href="/">
        <i>home</i>
        <div>Home</div>
      </a>
      <a href="/new.html">
        <i>add</i>
        <div>New</div>
      </a>
      <a href="/{{ post.next }}" id="next">
        <i>arrow_forward</i>
        <div>Next</div>
      </a>
    </nav>
    <main
      class="responsive"
      style="min-height: 100dvh; display: flex; flex-direction: column;"
    >
      <div style="flex-grow: 1; display: flex; flex-direction: column;">
        <article class="single-post" style="flex-grow:1">
          <h3>{{ post.title }}</h3>
          <p>
            {{ post.date.strftime('%B %d, %Y') }}
            {% if post.author %}
              by
              <a href="/authors/{{ post.author_index }}" class="author_link"
                >{{ post.author }}</a
              >
            {% endif %}
          </p>
          {% if post.tags %}
            <p>
              {% for tag in post.tags %}
                <a href="/tags/{{ tag }}.html" class="deemphasisze">
                  {{ tag }}{{ " | " if not loop.last else"" }}
                </a>
              {% endfor %}
            </p>
          {% endif %}
          <div class="small-space"></div>
          <hr style="width: 7%" />
          <div class="small-space"></div>

          <div class="markdown-body" style="flex-grow: 1">
            {{ content }}
          </div>
        </article>
      </div>
    </main>
  </body>
</html>
