58 lines
1 KiB
CSS
58 lines
1 KiB
CSS
/* Pager
|
|
|
|
Paged navigation is a list of page numbers when more than 1 page of content
|
|
is available. */
|
|
|
|
@layer components {
|
|
.pagination,
|
|
.pager {
|
|
--flex-inline-gap: .5rem;
|
|
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--flex-inline-gap);
|
|
padding: 0;
|
|
text-align: start;
|
|
|
|
/* Add vertical rhythm margins. */
|
|
margin-block: var(--spacing-m);
|
|
justify-content: center;
|
|
|
|
a {
|
|
text-decoration: none;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
|
|
.pager__item,
|
|
.page-link {
|
|
padding-inline: 2px;
|
|
}
|
|
|
|
.page-item {
|
|
}
|
|
|
|
.active {
|
|
font-weight: var(--fw-bold);
|
|
}
|
|
|
|
.disabled {
|
|
.page-link {
|
|
/* Re-set default cursor for disabled elements. */
|
|
cursor: default;
|
|
color: var(--color-button-disabled);
|
|
|
|
&:hover,
|
|
&:focus,
|
|
&:active {
|
|
/* Override any link underlines and color changes. */
|
|
color: var(--color-button-disabled);
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|