{% extends "base.html" %}

{% block content %}
<article class="blog-post">
    <header>
        <h1>{{ title }}</h1>
        <div class="post-meta">
            {% if created %}<time>{{ created }}</time>{% endif %}
            {% if updated %}<time>(updated {{ updated }})</time>{% endif %}
            {% if author %}<span class="author">by {{ author }}</span>{% endif %}
        </div>
        {% if description %}<p class="post-description">{{ description }}</p>{% endif %}
        {% if tags | length > 0 %}
        <ul class="tag-list">
            {% for tag in tags %}
            <li><a href="/tags/{{ tag.slug }}/">{{ tag.name }}</a></li>
            {% endfor %}
        </ul>
        {% endif %}
    </header>

    {% if image %}
    <img src="{{ image }}" alt="" class="post-hero">
    {% endif %}

    <div class="post-layout">
        {% if toc | length > 0 %}
        <aside class="toc">
            <h2>Contents</h2>
            <ul>
                {% for entry in toc %}
                <li class="toc-h{{ entry.level }}"><a href="#{{ entry.id }}">{{ entry.text }}</a></li>
                {% endfor %}
            </ul>
        </aside>
        {% endif %}

        <div class="post-body">
            {{ content | safe }}
        </div>
    </div>

    {% if backlinks | length > 0 %}
    <section class="backlinks">
        <h2>Pages that link here</h2>
        <ul>
            {% for link in backlinks %}
            <li><a href="{{ link.url | safe }}">{{ link.title }}</a></li>
            {% endfor %}
        </ul>
    </section>
    {% endif %}

    {% if newer_post or older_post %}
    <nav class="post-nav" aria-label="Adjacent posts">
        {% if newer_post %}
        <a class="post-nav-newer" rel="prev" href="{{ newer_post.url | safe }}">
            <span class="post-nav-label">&larr; Newer</span>
            <span class="post-nav-title">{{ newer_post.title }}</span>
            {% if newer_post.created %}<time>{{ newer_post.created }}</time>{% endif %}
        </a>
        {% endif %}
        {% if older_post %}
        <a class="post-nav-older" rel="next" href="{{ older_post.url | safe }}">
            <span class="post-nav-label">Older &rarr;</span>
            <span class="post-nav-title">{{ older_post.title }}</span>
            {% if older_post.created %}<time>{{ older_post.created }}</time>{% endif %}
        </a>
        {% endif %}
    </nav>
    {% endif %}
</article>
{% endblock content %}