// Pagination // ******************************************************************************* // Basic Pagination @mixin template-pagination-variant($parent, $background, $color: null) { #{$parent} .page-item .page-link, #{$parent}.pagination li > a:not(.page-link) { &:hover, &:focus { background-color: rgba($background, 0.16); color: $background; } } #{$parent} .page-item.active .page-link, #{$parent}.pagination li.active > a:not(.page-link) { box-shadow: 0 0.125rem 0.25rem 0 rgba($background, 0.4); &, &:hover, &:focus { border-color: $background; background-color: $background; color: if($color, $color, color-contrast($background)); } } } // Pagination Outline Variant @mixin template-pagination-outline-variant($parent, $background, $color: null) { #{$parent} .page-item.active .page-link, #{$parent}.pagination li.active > a:not(.page-link) { &, &:hover, &:focus { border-color: $background !important; color: $background !important; background-color: rgba-to-hex(rgba($background, 0.16), $card-bg) !important; } } } @mixin template-pagination-theme($background, $color: null) { @include template-pagination-variant('', $background, $color); }