PageIndexWidget: hide page numbers on smaller screens

This commit is contained in:
Aaron van Geffen 2023-03-21 23:12:47 +01:00
parent 9a8a91343b
commit 6c5d814a99
2 changed files with 28 additions and 2 deletions

View File

@ -46,6 +46,32 @@ a:hover {
border-color: #a40d0d;
}
@media (max-width: 767px) {
.pagination {
box-shadow: none;
height: 52px;
display: block;
position: relative;
}
.pagination .page-number, .pagination .page-padding {
display: none;
}
.pagination .page-link {
border-radius: var(--bs-pagination-border-radius) !important;
}
.pagination > :first-child, .pagination > :last-child {
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
display: inline-block;
position: absolute;
}
.pagination > :first-child {
left: 0;
}
.pagination > :last-child {
right: 0;
}
}
.btn {
font-family: 'Coda', sans-serif;
}

View File

@ -45,10 +45,10 @@ class PageIndexWidget extends Template
if (!is_array($page))
echo '
<li class="page-item disabled"><a class="page-link">...</a></li>';
<li class="page-item page-padding disabled"><a class="page-link">...</a></li>';
else
echo '
<li class="page-item', $page['is_selected'] ? ' active" aria-current="page' : '', '">',
<li class="page-item page-number', $page['is_selected'] ? ' active" aria-current="page' : '', '">',
'<a class="page-link" href="', $page['href'], '">', $page['index'], '</a></li>';
}