.pagination {
color: var(--body-color-light); text-align: center;
}
// Pagination items can be `span`s or `a`s .pagination-item {
display: block; padding: var(--spacer); text-decoration: none; border: solid var(--border-color); border-width: 1px 0; &:first-child { margin-bottom: -1px; }
}
// Only provide a hover state for linked pagination items a.pagination-item:hover {
background-color: var(--border-color); text-decoration: none;
}
@media (min-width: $md-screen) {
.pagination { margin: var(--spacer-3) 0; height: calc(var(--body-font-size) * var(--body-line-height) + var(--spacer) * 2); } .pagination-item { float: left; width: 50%; border-width: 1px; &:first-child { margin-bottom: 0; border-top-left-radius: var(--border-radius); border-bottom-left-radius: var(--border-radius); } &:last-child { margin-left: -1px; border-top-right-radius: var(--border-radius); border-bottom-right-radius: var(--border-radius); } }
}