// // Pagination // —————————————-
.pagination {
display: inline-block; padding-left: 0; margin: 0 ($pagination-gutter / 2 * -1); > li { display: inline; > a { float: left; display: block; width: $pagination-width; height: $pagination-height; margin: 0 ($pagination-gutter / 2); border-radius: 50%; background-color: $pagination-bgr-color; border: 1px solid $pagination-border-color; @include transition(all $transition-time-out $transition-function); } } > li > a { &.focus, &:focus { background-color: hsv-darken($pagination-bgr-color, 21%, true); border-color: hsv-darken($pagination-border-color, 21%, true); outline: 0; } &.hover, &:hover { background-color: hsv-darken($pagination-bgr-color, 7%, true); border-color: hsv-darken($pagination-border-color, 7%, true); @include transition($transition-time-in, '-duration'); } &.active, &:active { background-color: hsv-darken($pagination-bgr-color, 15%, true); border-color: hsv-darken($pagination-border-color, 15%, true); } } > .active > a { background-color: $pagination-active-bgr-color; border-color: $pagination-active-border-color; overflow: hidden; &:before { content: url('data:image/gif;base64,R0lGODdhDAAMAKUiAOYgheYhhuYihuYih+Yjh+YjiOYkh+YkiOYliOYlieYmiOYmieYniecniecniuYoiucoiecoiuYpiucpiucqiucqi+cri+csjOctjOcujecvjecvjucwjugxj+gyj+g0kOg1kOg1kf///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////ywAAAAADAAMAAAGXUAE4lAYBACAAOFwEB4IRqSS6YQGroKls3gNZJsJptWrXSzEAnKT8XgQ3oOvgiGpVN54A4JuuVzwTXMPFhgaGwVMCQ0QERQYHB4eiQ0RExQWGR0fIIkOlRWYHiAhQQA7'); line-height: $pagination-height; vertical-align: super; } &.focus, &:focus { background-color: hsv-darken($pagination-active-bgr-color, 21%, true); border-color: hsv-darken($pagination-active-border-color, 21%, true); } &.hover, &:hover { background-color: hsv-darken($pagination-active-bgr-color, 7%, true); border-color: hsv-darken($pagination-active-border-color, 7%, true); } &.active, &:active { background-color: hsv-darken($pagination-active-bgr-color, 15%, true); border-color: hsv-darken($pagination-active-border-color, 15%, true); } } > .disabled { > a, > a:hover, > a:focus, > a:active { background-color: $pagination-disabled-bgr-color; border-color: $pagination-disabled-border-color; cursor: not-allowed; } }
}
.pagination-small {
@include pagination-variant($pagination-width-small, $pagination-height-small, $pagination-gutter-small);
}