{% if list.pages > 1 %}
    {% set page = list.page %}
    <ul class="pagination justify-content-center mb-0">
        <li class="page-item {% if not request.page or request.page == 1 %}disabled{% endif %}">
            <a class="page-link"
               href="{% if request.page and request.page != 1 %}?{% for k,v in {}|merge(request)|merge({'page': 1}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}{% else %}#{% endif %}"
               aria-label="First">
                <svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                    <path
                        d="M18.41,7.41L17,6L11,12L17,18L18.41,16.59L13.83,12L18.41,7.41M12.41,7.41L11,6L5,12L11,18L12.41,16.59L7.83,12L12.41,7.41Z"/>
                </svg>
            </a>
        </li>

        <li class="page-item {% if not request.page or request.page == 1 %}disabled{% endif %}">
            <a class="page-link"
               href="{% if request.page  and request.page != '1' %}?{% for k,v in {}|merge(request)|merge({'page': request.page - 1}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}{% else %}#{% endif %}"
               aria-label="Previous">
                <svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                    <path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z"/>
                </svg>
            </a>
        </li>

        {% for i in 1..list.pages %}
            <li {% if i == page %}class="active page-item" {% endif %}>
                {% if i == request.page  or (not request.page and i == 1) %}
                    <a class="page-link" href="#" onclick="return false;">{{ i }}</a>
                {% else %}
                    <a class="page-link"
                       href="?{% for k,v in {}|merge(request)|merge({'page': i}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}">{{ i }}</a>
                {% endif %}
            </li>
        {% endfor %}

        <li class="page-item {% if request.page == list.pages %}disabled{% endif %}">
            <a class="page-link"
               href="{% if request.page and request.page != list.pages %}?{% for k,v in {}|merge(request)|merge({'page': request.page + 1}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}{% elseif not request.page %}?{% for k,v in {}|merge(request)|merge({'page': 2}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}{% else %}#{% endif %}"
               aria-label="Next">
                <svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                    <path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"/>
                </svg>
            </a>
        </li>

        <li class="page-item {% if request.page == list.pages %} disabled {% endif %}">
            <a class="page-link"
               href="{% if not request.page or request.page != list.pages %}?{% for k,v in {}|merge(request)|merge({'page': list.pages}) %}{{ k }}={{ v }}{% if loop.last == FALSE %}&{% endif %}{% endfor %}{% else %}#{% endif %}"
               aria-label="Last">
                <svg class="svg-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
                    <path
                        d="M5.59,7.41L7,6L13,12L7,18L5.59,16.59L10.17,12L5.59,7.41M11.59,7.41L13,6L19,12L13,18L11.59,16.59L16.17,12L11.59,7.41Z"/>
                </svg>
            </a>
        </li>
    </ul>
{% endif %}
