107 lines
2.9 KiB
Plaintext
107 lines
2.9 KiB
Plaintext
# Pagination
|
|
# Pagination - Bootstrap 4
|
|
snippet pag
|
|
<nav>
|
|
<ul class="pagination">
|
|
<li>
|
|
<a href="${3:#}" aria-label="${4:Previous}">
|
|
<span aria-hidden="true">«</span>
|
|
<span class="sr-only">${4:Previous}</span>
|
|
</a>
|
|
</li>
|
|
<li><a href="${1:#}">1</a></li>
|
|
<li><a href="${1:#}">2</a></li>
|
|
<li><a href="${1:#}">3</a></li>
|
|
${2:<li><a href="${1:#}">4</a></li>
|
|
<li><a href="${1:#}">5</a></li>}
|
|
<li>
|
|
<a href="${3:#}" aria-label="${4:Next}">
|
|
<span aria-hidden="true">»</span>
|
|
<span class="sr-only">${4:Next}</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|
|
# Pagination Disabled and active states - Bootstrap 4
|
|
snippet pagda
|
|
<nav>
|
|
<ul class="pagination">
|
|
<li class="disabled">
|
|
<a href="${1:#}" aria-label="${2:Previous}">
|
|
<span aria-hidden="true">«</span>
|
|
<span class="sr-only">${2:Previous}</span>
|
|
</a>
|
|
</li>
|
|
<li class="active">
|
|
<a href="${1:#}">1 <span class="sr-only">(current)</span></a>
|
|
</li>
|
|
<li><a href="${1:#}">2</a></li>
|
|
<li><a href="${1:#}">3</a></li>
|
|
<li><a href="${1:#}">4</a></li>
|
|
<li><a href="${1:#}">5</a></li>
|
|
<li>
|
|
<a href="${1:#}" aria-label="${3:Next}">
|
|
<span aria-hidden="true">»</span>
|
|
<span class="sr-only">${3:Next}</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|
|
# Pagination - Bootstrap 4
|
|
snippet pagsz
|
|
<nav>
|
|
<ul class="pagination pagination-${1:lg|sm}">
|
|
<li>
|
|
<a href="${1:#}" aria-label="${2:Previous}">
|
|
<span aria-hidden="true">«</span>
|
|
<span class="sr-only">${2:Previous}</span>
|
|
</a>
|
|
</li>
|
|
<li><a href="${1:#}">1</a></li>
|
|
<li><a href="${1:#}">2</a></li>
|
|
<li><a href="${1:#}">3</a></li>
|
|
<li>
|
|
<a href="${1:#}" aria-label="${3:Next}">
|
|
<span aria-hidden="true">»</span>
|
|
<span class="sr-only">${3:Next}</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|
|
# Pagination pager - Bootstrap 4
|
|
snippet pager
|
|
<nav>
|
|
<ul class="pager">
|
|
<li><a href="${1:#}">Previous</a></li>
|
|
<li><a href="${1:#}">Next</a></li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|
|
# Pagination pager aligned - Bootstrap 4
|
|
snippet pageral
|
|
<nav>
|
|
<ul class="pager">
|
|
<li class="pager-prev"><a href="${1:#}">Older</a></li>
|
|
<li class="pager-next"><a href="${1:#}">Newer</a></li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|
|
# Pagination pager aligned & disabled - Bootstrap 4
|
|
snippet pagerald
|
|
<nav>
|
|
<ul class="pager">
|
|
<li class="pager-prev disabled"><a href="${1:#}">Older</a></li>
|
|
<li class="pager-next"><a href="${1:#}">Newer</a></li>
|
|
</ul>
|
|
</nav>
|
|
endsnippet
|
|
|