/* Pagination Simple pagination inspired by Rdio, great for apps and search results. The large block is hard to miss, easily scalable, and provides large click areas. Default pagination with `.pagination`, it also support [WP-Paginate](http://wordpress.org/plugins/wp-paginate/). Markup: <div class="pagination {$modifiers}"> <ul> <li><a href="#">Prev</a></li> <li><a href="#">1</a></li> <li class="current"><a href="#">2</a></li> <li><a href="#">3</a></li> <li><a href="#">Next</a></li> </ul> </div> .pagination--center - Center aligned pagination. .pagination--right - Right aligned pagination. .pagination--rounded - Rounded sides. Styleguide 14 */ @if $pagination { .pagination { margin: rhythm() 0; clear: both; > * { @extend %clearfix; @include border-radius($base-border-radius); @extend %display-inline-block; margin-bottom: 0; margin-left: $input-border; li { @extend %float-left; list-style-type: none; a, span { @extend %display-inline-block; padding: $pagination-padding; line-height: 1em; @extend %text-decoration-none; border-width: $input-border; border-style: solid; margin-left: -$input-border; @extend %pagination--btn !optional; } } li:first-child > a, li:first-child > span { border-left-width: $input-border; } li > a:hover { @extend %pagination--btn__hover !optional; } li > a:active { @extend %pagination--btn__active !optional; } li.current a, li.current a:hover, // WP Paginate a.current, a.current:hover { @extend %pagination--btn__current !optional; } .disabled > span, .disabled > a, .disabled > a:hover, .disabled > a:focus { @extend %pagination--btn__disabled !optional; } .active > a, .active > span, .disabled > span, .disabled > a, .disabled > a:hover, .disabled > a:focus { @extend %cursor-default; } } } // Alternative alignments .pagination--center {@extend %text-align-center; } .pagination--right {@extend %text-align-right; } // Rounded sides .pagination--rounded { li:first-child > a, li:first-child > span { @include border-left-radius($base-border-radius); } li:last-child > a, li:last-child > span { @include border-right-radius($base-border-radius); } } }