ETR Component Library

Pagination 

<nav aria-label="Pagination Navigation">
    <ul class="w-64 flex items-center justify-between text-xl m-auto py-6">
        <li class="py-1 px-4 bg-primary text-white" aria-label="Current Page, Page 1" aria-current="true">1</li>
        <li><a href="/page-2" aria-label="Go to Page 2">2</a></li>
        <li><a href="/page-3" aria-label="Go to Page 3">3</a></li>
        <li><a href="/page-4" aria-label="Go to Page 4">4</a></li>
        <li><a href="/page-5" aria-label="Go to Page 5">5</a></li>
        <li>...</li>
        <li><a href="/page-5" aria-label="Go to Page 10">10</a></li>
        <li class="w-4 h-4 color-primary stroke-current">
            <a href="#" aria-label="Next Page">
                <?xml version="1.0" encoding="UTF-8"?>
                <svg version="1.1" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg">
<title>icon-chevron-right</title>
<desc>Created with Sketch.</desc>
<g fill="none" fill-rule="evenodd">
<polyline transform="translate(20 20) scale(1 -1) rotate(-90) translate(-20 -20)" points="1 11.767 20 28.233 39 11.767" stroke-width="3"/>
</g>
</svg>
            </a>
        </li>
    </ul>
</nav>
 
<nav aria-label="Pagination Navigation">
    <ul class="w-64 flex items-center justify-between text-xl m-auto py-6">
        <li class="py-1 px-4 bg-primary text-white" aria-label="Current Page, Page 1" aria-current="true">1</li>
        <li><a href="/page-2" aria-label="Go to Page 2">2</a></li>
        <li><a href="/page-3" aria-label="Go to Page 3">3</a></li>
        <li><a href="/page-4" aria-label="Go to Page 4">4</a></li>
        <li><a href="/page-5" aria-label="Go to Page 5">5</a></li>
        <li>...</li>
        <li><a href="/page-5" aria-label="Go to Page 10">10</a></li>
        <li class="w-4 h-4 color-primary stroke-current"><a href="#" aria-label="Next Page">{{> @icon-chevron-right }}</a></li>
    </ul>
</nav>
 
/* No context defined for this component. */

There are no notes for this item.