openproject/frontend/app/components/wp-table/table-pagination/table-pagination.directive.html

<div class="pagination">
  <nav class="pagination--pages">
    <ul class="pagination--items">

      <li ng-show="paginationOptions.page != 1" class="pagination--item">
        <a ng-click="showPage(paginationOptions.page - 1)"
           rel="prev start"
           href="">{{ I18n.t('js.label_previous') }}
        </a>
      </li>

      <li ng-if="prePageNumbers.length" ng-repeat="pageNumber in prePageNumbers"
        class="pagination--item">
        <a ng-click="showPage(pageNumber)"
           rel="next"
           href="">{{ pageNumber }}</a>
      </li>
      <li ng-if="prePageNumbers.length" class="pagination--space">…</li>

      <li ng-if="pageNumbers.length > 1"
          ng-repeat="pageNumber in pageNumbers"
          ng-class="{ '-current': pageNumber == paginationOptions.page }"
          class="pagination--item">
        <em ng-if="pageNumber == paginationOptions.page">{{ pageNumber }}</em>
        <a ng-if="pageNumber != paginationOptions.page"
           ng-click="showPage(pageNumber)"
           rel="next"
           href="">{{ pageNumber }}</a>
      </li>

      <li ng-if="postPageNumbers.length" class="pagination--space">…</li>

      <li ng-if="postPageNumbers" ng-repeat="pageNumber in postPageNumbers" class="pagination--item">
        <a ng-click="showPage(pageNumber)"
           rel="next"
           href="">{{ pageNumber }}</a>
      </li>
      <li ng-show="totalEntries && paginationOptions.page < pageNumbers[pageNumbers.length - 1]"
        class="pagination--item">
        <a ng-click="showPage(paginationOptions.page + 1)"
           rel="next"
           class="pagination--next-link"
           href="">{{ I18n.t('js.label_next') }}
        </a>
      </li>

      <li class="pagination--range" title="{{ currentRange }}">{{ currentRange }}</li>
    </ul>
  </nav>

  <div class="pagination--options">
    <ul class="pagination--items">
      <li class="pagination--label" title="{{ I18n.t('js.label_per_page') }}">{{ I18n.t('js.label_per_page') }}</li>

      <li ng-repeat="perPageOption in paginationOptions.perPageOptions"
          ng-class="{ '-current': perPageOption == paginationOptions.perPage }"
          class="pagination--item">

       <span ng-if="perPageOption != paginationOptions.perPage">
         <a href="" ng-click="selectPerPage(perPageOption)">{{ perPageOption }}</a>
       </span>

       <span ng-if="perPageOption == paginationOptions.perPage">{{ perPageOption }}</span>
      </li>
    </ul>
  </div>
</div>