{% extends 'simpel_pages/detail.html' %}
{% load i18n pages_tags pages_widget_tags thumbnail %}

{% block content %}
  <div class="row">
    <div class="col-lg-8 offset-lg-2">
      <article class="article px-3 px-md-0">
        <div class="text-center py-4">
          <h1 class="post-title">{{ object.title }}</h1>
          <div class="post-meta mb-3">
            <span>
            {% trans "Posted on" %}
            {{ object.created_at }}
            {% if object.category %}
              {% trans "in" %} <a href="{% url 'serve_category' slug=object.category.slug %}">{{ object.category|title }}</a>
            {% endif %}
            </span>
          </div>
        </div>
        {% if object.thumbnail %}
          <div class="mb-3">
            {% thumbnail object.thumbnail 960x540 crop as thumb %}
            <img class="img-fluid" width="{{ thumb.width }}" height="{{ thumb.height }}" src="{{ thumb.url }}" alt="">
          </div>
        {% endif %}
        {% if object.content %}
          <div class="post-body">
            {{ object.content|safe }}
          </div>
        {% endif %}
        {% if object.tags.count %}
          <div>
            <strong>{% trans "Tags" %}:</strong>
            {% for tag in object.tags.all %}
              <a href="{% url 'serve_tag' slug=tag.slug %}">{{ tag|title }}</a>
            {% endfor %}
          </div>
        {% endif %}
        {% if object.readers.count %}
          <div>
            <strong>{% trans "Readers" %}:</strong>
            {% for reader in object.readers.all %}
              <a href="#">{{ reader.get_full_name|title }}</a>
            {% endfor %}
          </div>
        {% endif %}
        <div class="my-3 border-bottom"></div>
        {% related_pages "Related Pages" object number=4 template_name='simpel_pages/widgets/page_related.html' %}
      </article>
    </div>
  </div>
{% endblock content %}
