NodeBB/NodeBB

<div component="pagination" class="pagination-container mt-3{{{ if !pagination.pages.length }}} hidden{{{ end }}}">
    <ul class="pagination pagination-sm gap-1 hidden-xs hidden-sm justify-content-center">
        <li class="page-item previous float-start{{{ if !pagination.prev.active }}} disabled{{{ end }}}">
            <a class="page-link rounded fw-secondary px-3" href="?{pagination.prev.qs}" data-page="{pagination.prev.page}"><i class="fa fa-chevron-left"></i> </a>
        </li>

        {{{each pagination.pages}}}
            {{{ if pagination.pages.separator }}}
            <li component="pagination/select-page" class="page-item page select-page">
                <a class="page-link rounded fw-secondary px-3" href="#"><i class="fa fa-ellipsis-h"></i></a>
            </li>
            {{{ else }}}
            <li class="page-item page{{{ if pagination.pages.active }}} active{{{ end }}}" >
                <a class="page-link rounded fw-secondary px-3" href="?{pagination.pages.qs}" data-page="{pagination.pages.page}">{pagination.pages.page}</a>
            </li>
            {{{ end }}}
        {{{end}}}

        <li class="page-item next float-end {{{ if !pagination.next.active }}} disabled{{{ end }}}">
            <a class="page-link rounded fw-secondary px-3" href="?{pagination.next.qs}" data-page="{pagination.next.page}"> <i class="fa fa-chevron-right"></i></a>
        </li>
    </ul>

    {{{ if !template.topic }}}
    <ul class="pagination pagination-sm hidden-md hidden-lg justify-content-center">
        <li class="page-item first{{{ if !pagination.prev.active }}} disabled{{{ end }}}">
            <a class="page-link fw-secondary"  href="?{pagination.first.qs}" data-page="1"><i class="fa fa-fast-backward"></i> </a>
        </li>

        <li class="page-item previous{{{ if !pagination.prev.active }}} disabled{{{ end }}}">
            <a class="page-link fw-secondary"  href="?{pagination.prev.qs}" data-page="{pagination.prev.page}"><i class="fa fa-chevron-left"></i> </a>
        </li>

        <li component="pagination/select-page" class="page-item page select-page">
            <a class="page-link fw-secondary"  href="#">{pagination.currentPage} / {pagination.pageCount}</a>
        </li>

        <li class="page-item next{{{ if !pagination.next.active }}} disabled{{{ end }}}">
            <a class="page-link fw-secondary"  href="?{pagination.next.qs}" data-page="{pagination.next.page}"> <i class="fa fa-chevron-right"></i></a>
        </li>

        <li class="page-item last{{{ if !pagination.next.active }}} disabled{{{ end }}}">
            <a class="page-link fw-secondary"  href="?{pagination.last.qs}" data-page="{pagination.pageCount}"><i class="fa fa-fast-forward"></i> </a>
        </li>
    </ul>
    {{{ end }}}
</div>