Pagination

Pagination

          <div class="pagination">
            <ul>
              <li class="pagination__arrow">
                <a href="">
                  <i class="ico ico--md ico--f-chevron-l-s is-disabled"></i>
                </a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">1</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">...</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">5</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">6</a>
              </li>
              <li class="pagination__button is-active">
                <a href="#LINK">7</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">8</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">9</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">...</a>
              </li>
              <li class="pagination__button">
                <a href="#LINK">40</a>
              </li>
              <li class="pagination__arrow">
                <a href="">
                  <i class="ico ico--md ico--f-chevron-r-s"></i>
                </a>
              </li>
            </ul>
          </div>
        

Pagination Documentation

Use

Variations