{% load i18n %}

{% if is_paginated %}
    <nav>
        <ul class="pagination{% if size %} pagination-{{ size }}{% endif %}">
            {% if page_obj.has_previous %}
                <li class="previous">
                    <a href="?{{ page_obj.previous_page_number.querystring }}" aria-label="{% trans 'previous page' %}">
                        <span aria-hidden="true">&laquo;{% if verbose %} {% trans 'previous page' %}{% endif %}</span>
                    </a>
                </li>
            {% else %}
                <li class="previous disabled">
                    <span>
                        <span aria-hidden="true">&laquo;{% if verbose %} {% trans 'previous page' %}{% endif %}</span>
                    </span>
                </li>
            {% endif %}

            {% for page in page_obj.pages %}
                {% if page %}
                    {% if page == page_obj.number %}
                        <li class="active">
                            <span>{{ page }} <span class="sr-only">({% trans 'current page' %})</span></span>
                        </li>
                    {% else %}
                        <li>
                            <a href="?{{ page.querystring }}">{{ page }}</a>
                        </li>
                    {% endif %}
                {% else %}
                    <li class="disabled">
                        <span>...</span>
                    </li>
                {% endif %}
            {% endfor %}

            {% if page_obj.has_next %}
                <li class="next">
                    <a href="?{{ page_obj.next_page_number.querystring }}" aria-label="{% trans 'next page' %}">
                        <span aria-hidden="true">{% if verbose %}{% trans 'next page' %} {% endif %}&raquo;</span>
                    </a>
                </li>
            {% else %}
                <li class="next disabled">
                    <span>
                        <span aria-hidden="true">{% if verbose %}{% trans 'next page' %} {% endif %}&raquo;</span>
                    </span>
                </li>
            {% endif %}
        </ul>
    </nav>
{% endif %}
