Pagination

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. …
  8. 20
  9. 21
HTML 
<div class="fizz-pagination">
  <button id="previous" class="fizz-icon-button" disabled><svg class="fizz-icon-16" role="img" aria-hidden="true" width="24" height="24">
      <use href="#chevron-left"></use>
    </svg></button>
  <ol class="fizz-pagination-list">
    <li class="fizz-is-active" data-page="1 of 21"><a href="#">1</a></li>
    <li data-page="2 of 21"><a href="#">2</a></li>
    <li data-page="3 of 21"><a href="#">3</a></li>
    <li data-page="4 of 21"><a href="#">4</a></li>
    <li data-page="5 of 21"><a href="#">5</a></li>
    <li data-page="6 of 21"><a href="#">6</a></li>
    <li><a href="#">&mldr;</a></li>
    <li data-page="20 of 21"><a href="#">20</a></li>
    <li data-page="21 of 21"><a href="#">21</a></li>
  </ol>
  <button id="next" class="fizz-icon-button"><svg class="fizz-icon-16" role="img" aria-hidden="true" width="24" height="24">
      <use href="#chevron-right"></use>
    </svg></button>
</div>