{% load i18n datashow_tags %}
<nav aria-label="{% trans "Pagination" %}">
    <ul class="pagination w-100 flex-wrap">
        {% if page_obj.has_previous %}
            <li class="page-item">
                <a href="?{% querystring "page" page_obj.previous_page_number %}"
                   class="page-link prev"
                   title="{% trans "previous" %}">
                    <span aria-hidden="true">←</span>
                    <span class="visually-hidden">{% trans "previous" %}</span>
                </a>
            </li>
        {% else %}
            <li class="page-item disabled">
                <span class="page-link">
                    <span aria-hidden="true">←</span>
                    <span class="visually-hidden">{% trans "previous" %}</span>
                </span>
            </li>
        {% endif %}
        {% with page_range=page_obj.paginator.page_range|listify %}
            {% for page in page_range|slice:":3" %}
                {% if page < page_obj.number %}
                    <li class="page-item">
                        <a class="page-link" href="?{% querystring "page" page %}">{{ page }}</a>
                    </li>
                {% endif %}
            {% endfor %}
            {% if page_obj.number > 5 and page_obj.paginator.num_pages > 6 %}
                <li class="page-item">
                    <li class="page-item disabled">
                        <span class="page-link" aria-hidden="true">…</span>
                    </li>
                </li>
            {% endif %}
            {% for page in page_range|slice:"-3:" %}
                {% if page < page_obj.number and page > 3 %}
                    <li class="page-item">
                        <a class="page-link" href="?{% querystring "page" page %}">{{ page }}</a>
                    </li>
                {% endif %}
            {% endfor %}
            {% if page_obj.has_previous and page_obj.previous_page_number > 3 and page_obj.previous_page_number <= page_obj.paginator.num_pages|add:"-3" %}
                <li class="page-item">
                    <a class="page-link"
                       href="?{% querystring "page" page_obj.previous_page_number %}">
                        {{ page_obj.previous_page_number }}
                    </a>
                </li>
            {% endif %}
            <li class="page-item active">
                <span class="page-link">
                    {{ page_obj.number }}
                    <span class="visually-hidden">{% trans "(current page)" %}</span>
                </span>
            </li>
            {% if page_obj.has_next and page_obj.next_page_number > 3 and page_obj.next_page_number <= page_obj.paginator.num_pages|add:"-3" %}
                <li class="page-item">
                    <a class="page-link"
                       href="?{% querystring "page" page_obj.next_page_number %}">{{ page_obj.next_page_number }}</a>
                </li>
            {% endif %}
            {% for page in page_range|slice:":3" %}
                {% if page > page_obj.number %}
                    <li class="page-item">
                        <a class="page-link" href="?{% querystring "page" page %}">{{ page }}</a>
                    </li>
                {% endif %}
            {% endfor %}
            {% if page_obj.number < page_obj.paginator.num_pages|add:"-4" and page_obj.paginator.num_pages > 6 %}
                <li class="page-item disabled">
                    <span class="page-link" aria-hidden="true">…</span>
                </li>
            {% endif %}
            {% for page in page_range|slice:"-3:" %}
                {% if page > page_obj.number and page > 3 %}
                    <li class="page-item">
                        <a class="page-link" href="?{% querystring "page" page %}">{{ page }}</a>
                    </li>
                {% endif %}
            {% endfor %}
        {% endwith %}
        {% if page_obj.has_next %}
            <li class="page-item">
                <a href="?{% querystring "page" page_obj.next_page_number %}"
                   class="page-link next">
                    <span aria-hidden="true">→</span>
                    <span class="visually-hidden">{% trans "next" %}</span>
                </a>
            </li>
        {% else %}
            <li class="page-item disabled">
                <a class="page-link" href="#" tabindex="-1">
                    <span class="visually-hidden">{% trans "next" %}</span>
                    <span aria-hidden="true">→</span>
                </a>
            </li>
        {% endif %}
    </ul>
</nav>
