{% extends "core/base.html" %}
{% load truncate %}
{% load escaping %}
{% load i18n %}
{% load dates %}

{% block title %}{{ journal_settings.news.news_title }}{% endblock title %}

{% block body %}
    <section id="content" class="">
        <div class="row column ">
            <h1 class="news-item-block">{{ journal_settings.news.news_title }}</h1>
            {% if tag %}<h2>{% trans "Filtering tag" %}: {{ tag }}</h2>{% endif %}
            {% for item in news_items %}
                <div class="news-item-block">
                    <div class="row">
                        {% if item.large_image_file or request.journal and request.journal.default_large_image or request.press.default_carousel_image %}
                        <div class="large-5 columns">
                            <a href="{% url 'core_news_item' item.pk %}"><img class="news-image"
                                src="{{ item.best_image_url }}"
                                alt="{{ item.title|striptags|unescape }}"/></a>
                        </div>
                        {% endif %}
                        <div class="large-7 columns">
                            <h2 id="news-{{ item.pk }}">{{ item.title|safe }}</h2>
                            <p class="byline">{{ item.byline }} {% trans "on" %} {{ item.posted|date_human }}</p>
                            <p>{{ item.body|truncatewords_html:50|safe}}</p>
                            <a class="button" href="{% url 'core_news_item' item.pk %}"
                                aria-describedby="news-{{ item.pk }}">
                                {% trans "Read More" %}
                            </a>
                        </div>
                    </div>


                </div>
                {% empty %}
                <h2>{% trans "This journal currently has no news items to display." %}</h2>
            {% endfor %}
        </div>
        <div class="pagination-block">
            <ul class="pagination">
                {% if news_items.has_previous %}
                    <li class="arrow"><a href="?page={{ news_items.previous_page_number }}">
                        {% include "elements/icons/page_previous.html" %}
                    </a>
                    </li>{% endif %}
                {{ news_items.page.page_range }}
                {% for page in news_items.paginator.page_range %}
                    <li class="{% if news_items.number == page %}current{% endif %}"><a
                            href="?page={{ page }}">{{ page }}</a></li>
                {% endfor %}
                {% if news_items.has_next %}
                    <li class="arrow"><a href="?page={{ news_items.next_page_number }}">
                        {% include "elements/icons/page_next.html" %}
                    </a>
                    </li>{% endif %}
            </ul>
        </div>
    </section>
{% endblock body %}