{% extends "base.html" %}

{% block content %}
<h1>{{ source_name }} - Articles</h1>

<div class="pagination">
    {% if pagination.has_prev %}
        <a href="/source/{{ source_slug }}?page={{ pagination.prev_num }}">&laquo; Previous</a>
    {% endif %}
    <span>Page {{ pagination.page }} of {{ pagination.pages }}</span>
    {% if pagination.has_next %}
        <a href="/source/{{ source_slug }}?page={{ pagination.next_num }}">Next &raquo;</a>
    {% endif %}
</div>

<div class="timeline">
{% for date, articles in articles_by_date %}
    <div class="timeline-date">
        <span class="date-label">{{ date }}</span>
        <span class="date-count">{{ articles|length }} article{% if articles|length != 1 %}s{% endif %}</span>
    </div>
    <ul class="article-list">
    {% for article in articles %}
        <li class="article-item">
            <div class="article-main">
                <h3><a href="{{ article.url }}">{{ article.title }}</a></h3>
                <p class="article-summary">{{ article.summary }}</p>
            </div>
        </li>
    {% endfor %}
    </ul>
{% endfor %}
</div>

<div class="pagination">
    {% if pagination.has_prev %}
        <a href="/source/{{ source_slug }}?page={{ pagination.prev_num }}">&laquo; Previous</a>
    {% endif %}
    <span>Page {{ pagination.page }} of {{ pagination.pages }}</span>
    {% if pagination.has_next %}
        <a href="/source/{{ source_slug }}?page={{ pagination.next_num }}">Next &raquo;</a>
    {% endif %}
</div>
{% endblock %}