website/web/templates/partials/simple_pager.html

<!--
A simple and generic Paginator row, with page buttons and Previous/Next

Usage: [[SimplePager .Pager]]

Give it your Pagination object (with .Previous, .Next, .Iter() and so on). It
links to the current .Request.URL.Path and with all query parameters + the page
added. Should be suitable for most pagers that don't need any specialized logic.

See also: template_funcs.go for the SimplePager wrapper function.
-->
{{define "SimplePager"}}
    {{if .Pager.Pages}}
    <nav class="pagination" role="navigation" aria-label="pagination">
        <a class="pagination-previous{{if not .Pager.HasPrevious}} is-disabled{{end}}" title="Previous"
            href="{{.Request.URL.Path}}?{{QueryPlus "page" .Pager.Previous}}"
            style="font-size: smaller">Previous</a>
        <a class="pagination-next{{if not .Pager.HasNext}} is-disabled{{end}}" title="Next"
            href="{{.Request.URL.Path}}?{{QueryPlus "page" .Pager.Next}}"
            style="font-size: smaller">Next page</a>
        <ul class="pagination-list">
            {{$Root := .}}
            {{$DropdownID := .Pager.UniqueSerialID}}
            {{range .Pager.Iter}}
            <li>
                <!-- Overflow menu in the middle? -->
                {{if .IsOverflow}}
                <div class="dropdown px-1">
                    <div class="dropdown-trigger">
                        <button type="button" class="button{{if .IsCurrent}} is-link{{end}}" aria-haspopup="true" aria-controls="{{$DropdownID}}" style="font-size: smaller">
                            {{.Page}} <i class="fas fa-angle-down ml-1" aria-hidden="true"></i>
                        </button>
                    </div>
                    <div class="dropdown-menu" id="{{$DropdownID}}" role="menu">
                        <div class="dropdown-content" style="max-height: 250px; overflow: auto">
                            {{range .IterOverflow}}
                            <a class="dropdown-item{{if .IsCurrent}} is-active{{end}}"
                                aria-label="Page {{.Page}}"
                                href="{{$Root.Request.URL.Path}}?{{QueryPlus "page" .Page}}">{{.Page}}</a>
                            {{end}}
                        </div>
                    </div>
                </div>
                {{else}}
                <a class="pagination-link{{if .IsCurrent}} is-current{{end}}"
                    style="font-size: smaller"
                    aria-label="Page {{.Page}}"
                    href="{{$Root.Request.URL.Path}}?{{QueryPlus "page" .Page}}">
                    {{.Page}}
                </a>
                {{end}}
            </li>
            {{end}}
        </ul>
    </nav>
    {{end}}
{{end}}