{% extends "kioblog/base.html" %}
{% load i18n %}
{% load static %}

{% block title %}{{ post.title }}{% endblock %}
{% block meta_title %}{{ post.meta_title }}{% endblock %}
{% block meta_description %}{{ post.meta_description }}{% endblock %}

{% block content %}
    <div id="content">
        <section class="kioblog-post">
            <h4 class="text-secondary mb0 regular">
                {{ post.category.title }}
            </h4>
            <h2 class="mt1 mb0">
                {{ post.title }}
            </h2>
            <div class="mb1">
                <small>{{ post.user.get_full_name }} {{ post.published|date:'Y/m/d' }} &middot; {{ post.reading_time }} min read</small>
            </div>
            {% if post.image %}
            <img src="{{ post.image.url }}" alt="{{ post.title }}">
            {% endif %}
            <article>
                {{ post.content_html|safe }}
            </article>
            {% if post.tags.all %}
            <div class="kioblog-tags mt2">
                {% for tag in post.tags.all %}
                <a href="{% url 'kioblog-tag' tag.slug %}" class="kioblog-tag">#{{ tag.title }}</a>
                {% endfor %}
            </div>
            {% endif %}
        </section>

        <nav class="kioblog-postnav clearfix my3">
            {% if prev_post %}
            <a class="left" href="{% url 'kioblog-post' prev_post.slug %}">&laquo; {{ prev_post.title }}</a>
            {% endif %}
            {% if next_post %}
            <a class="right" href="{% url 'kioblog-post' next_post.slug %}">{{ next_post.title }} &raquo;</a>
            {% endif %}
        </nav>

        {% if related_posts %}
        <section class="kioblog-related my3">
            <h3>{% trans 'Related posts' %}</h3>
            <ul>
                {% for related in related_posts %}
                <li><a href="{% url 'kioblog-post' related.slug %}">{{ related.title }}</a></li>
                {% endfor %}
            </ul>
        </section>
        {% endif %}
    </div>
{% endblock %}