{% extends "base.html" %}
{% block content %}
<h1>{{ page.title }}</h1>
<hr style="border: dashed 1px; color: var(--linkColor); width: 93%; margin: 1em auto;">
<article>
{% if page.toc and page.extra.toc %}
{% for h1 in page.toc %}
  <div class="navtoc">
  <a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
  {% if h1.children %}
      {% for h2 in h1.children %}
        <a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
          {% for h3 in h2.children %}
            <a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
          {% endfor %}
      {% endfor %}
  {% endif %}
  </div>
{% endfor %}
{% endif %}
  {{ page.content | safe }}

<br>
<time datetime="{{ page.date }}">published <span class="metaData">{{ page.date }}</span></time>
{% if config.extra.author and config.extra.display_author == true %}
<address rel="author">by <span class="metaData">{{config.extra.author}}</span></address>
{% endif %}
<p class="tagsData">
{% if page.taxonomies.tags %}
{% for tag in page.taxonomies.tags %}
<a href="/tags/{{ tag | slugify }}">&#47;{{ tag }}&#47;</a>
{% endfor %}
{% endif %}
</article>
<p style="clear: both; text-align: right; position:sticky; bottom: 15px;">
  <a href="/blog" title="back to blog posts">
    <i class="ph ph-arrow-bend-down-left"></i>
  </a>
  <a href="#top" title="return to top">
    <i class="ph ph-arrow-fat-lines-up"></i>
  </a>
</p>

{% endblock content %}