90 lines
4.6 KiB
HTML
90 lines
4.6 KiB
HTML
{% load i18n static %}
|
|
<div class="d-flex justify-content-between align-items-center mt-4">
|
|
<div class="text-body-secondary">
|
|
{{ _("Showing") }} {{ page_obj.start_index }} {{ _("to") }} {{ page_obj.end_index }}
|
|
{{ _("of") }} {{ page_obj.paginator.count }} {{ _("results") }}
|
|
</div>
|
|
<nav aria-label="Page navigation">
|
|
<ul class="pagination mb-0">
|
|
{# First Page Link #}
|
|
{% if page_obj.has_previous %}
|
|
<li class="page-item rounded-md overflow-hidden">
|
|
<a class="page-link px-3 py-2 border border-gray-300 bg-white text-blue-600 hover:bg-gray-100 transition-colors duration-200" href="?page=1{% if q %}&q={{q}}{% endif %}" aria-label="{% trans 'First' %}">
|
|
<span class="fas fa-angle-double-left" aria-hidden="true"></span>
|
|
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled rounded-md overflow-hidden">
|
|
<span class="page-link px-3 py-2 border border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed">
|
|
<span class="fas fa-angle-double-left" aria-hidden="true"></span>
|
|
|
|
</span>
|
|
</li>
|
|
{% endif %}
|
|
|
|
{# Previous Page Link #}
|
|
{% if page_obj.has_previous %}
|
|
<li class="page-item rounded-md overflow-hidden">
|
|
<a class="page-link px-3 py-2 border border-gray-300 bg-white text-blue-600 hover:bg-gray-100 transition-colors duration-200" href="?page={{ page_obj.previous_page_number }}{% if q %}&q={{q}}{% endif %}" aria-label="{% trans 'Previous' %}">
|
|
<span class="fas fa-chevron-left" aria-hidden="true"></span>
|
|
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled rounded-md overflow-hidden">
|
|
<span class="page-link px-3 py-2 border border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed">
|
|
<span class="fas fa-chevron-left" aria-hidden="true"></span>
|
|
|
|
</span>
|
|
</li>
|
|
{% endif %}
|
|
|
|
{# Page Numbers #}
|
|
{% for num in page_obj.paginator.page_range %}
|
|
{% if num == 1 or num == page_obj.paginator.num_pages or num >= page_obj.number|add:-2 and num <= page_obj.number|add:2 %}
|
|
<li class="page-item {% if num == page_obj.number %}active{% endif %}">
|
|
<a class="page-link" {% if num == page_obj.number %}aria-current="page"{% endif %}
|
|
href="?page={{ num }}{% if q %}&q={{q}}{% endif %}">
|
|
{{ num }}
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
{# Next Page Link #}
|
|
{% if page_obj.has_next %}
|
|
<li class="page-item rounded-md overflow-hidden">
|
|
<a class="page-link px-3 py-2 border border-gray-300 bg-white text-blue-600 hover:bg-gray-100 transition-colors duration-200" href="?page={{ page_obj.next_page_number }}{% if q %}&q={{q}}{% endif %}" aria-label="{% trans 'Next' %}">
|
|
<span class="fas fa-chevron-right" aria-hidden="true"></span>
|
|
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled rounded-md overflow-hidden">
|
|
<span class="page-link px-3 py-2 border border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed">
|
|
<span class="fas fa-chevron-right" aria-hidden="true"></span>
|
|
|
|
</span>
|
|
</li>
|
|
{% endif %}
|
|
|
|
{# Last Page Link #}
|
|
{% if page_obj.has_next %}
|
|
<li class="page-item rounded-md overflow-hidden">
|
|
<a class="page-link px-3 py-2 border border-gray-300 bg-white text-blue-600 hover:bg-gray-100 transition-colors duration-200" href="?page={{ page_obj.paginator.num_pages }}{% if q %}&q={{q}}{% endif %}" aria-label="{% trans 'Last' %}">
|
|
<span class="fas fa-angle-double-right" aria-hidden="true"></span>
|
|
|
|
</a>
|
|
</li>
|
|
{% else %}
|
|
<li class="page-item disabled rounded-md overflow-hidden">
|
|
<span class="page-link px-3 py-2 border border-gray-200 bg-gray-50 text-gray-400 cursor-not-allowed">
|
|
<span class="fas fa-angle-double-right" aria-hidden="true"></span>
|
|
|
|
</span>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
</nav>
|
|
</div> |