CDLIB UI

Pagination 

<nav class="c-pagination">
    <ul>
        <li><a href="https://cdlib.org" aria-label="previous page">Previous</a></li>
        <li><a href="https://cdlib.org" aria-label="page 1">1</a></li>
        <li><a href="https://cdlib.org" title="previous set of pages">&hellip;</a></li>
        <li><a href="https://cdlib.org" aria-label="page 11">11</a></li>
        <li><a href="https://cdlib.org" aria-label="page 12">12</a></li>
        <li><a href="https://cdlib.org" aria-current="page">13</a></li>
        <li><a href="https://cdlib.org" aria-label="page 14">14</a></li>
        <li><a href="https://cdlib.org" aria-label="page 15">15</a></li>
        <li><a href="https://cdlib.org" title="next set of pages">&hellip;</a></li>
        <li><a href="https://cdlib.org" aria-label="page 47">47</a></li>
        <li><a href="https://cdlib.org" aria-label="next page">Next</a></li>
    </ul>
</nav>
 
<nav class="c-pagination">
  <ul>
    <li><a href="https://cdlib.org" aria-label="previous page">Previous</a></li>
    <li><a href="https://cdlib.org" aria-label="page {{ minimumNumber }}">{{ minimumNumber }}</a></li>
    <li><a href="https://cdlib.org" title="previous set of pages">&hellip;</a></li>
    {{#each list}}
    <li><a href="https://cdlib.org" {{#if pagination.current}}aria-current="page"{{else}}aria-label="page {{ pagination.number }}"{{/if}}>{{ pagination.number }}</a></li>
    {{/each}}
    <li><a href="https://cdlib.org" title="next set of pages">&hellip;</a></li>
    <li><a href="https://cdlib.org" aria-label="page {{ maximumNumber }}">{{ maximumNumber }}</a></li>
    <li><a href="https://cdlib.org" aria-label="next page">Next</a></li>
  </ul>
</nav>
 
{
  "list": [
    {
      "pagination": {
        "number": 11,
        "current": false
      }
    },
    {
      "pagination": {
        "number": 12,
        "current": false
      }
    },
    {
      "pagination": {
        "number": 13,
        "current": true
      }
    },
    {
      "pagination": {
        "number": 14,
        "current": false
      }
    },
    {
      "pagination": {
        "number": 15,
        "current": false
      }
    }
  ],
  "minimumNumber": 1,
  "maximumNumber": 47
}

No notes defined.