f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-15 19:12:38 +00:00
Code Wiki Activity

display pagination on top as well

Browse Source
This commit is contained in:
Víctor Losada Hernández
2025-03-08 19:32:26 +01:00
parent c0eef7530e
commit b07317b0f7
2 changed files with 11 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/homebrew/pages/vaultPage/vaultPage.jsx
View File

@@ -395,6 +395,7 @@ const VaultPage = (props)=>{
{`Brews found: `} {`Brews found: `}
<span>{totalBrews}</span> <span>{totalBrews}</span>
</span> </span>
{brewCollection.length > 10 && renderPaginationControls()}
{brewCollection.map((brew, index)=>{ {brewCollection.map((brew, index)=>{
return ( return (
<BrewItem <BrewItem

13
client/homebrew/pages/vaultPage/vaultPage.less
View File

@@ -169,7 +169,7 @@
width : 100%; width : 100%;
height : 100%; height : 100%;
max-height : 100%; max-height : 100%;
padding : 50px 50px 70px 50px; padding : 70px 50px;
overflow-y : scroll; overflow-y : scroll;
background-color : #2C3E50; background-color : #2C3E50;
container-type : inline-size; container-type : inline-size;
@@ -280,25 +280,32 @@
.paginationControls { .paginationControls {
position : absolute; position : absolute;
top : 35px;
left : 50%; left : 50%;
display : grid; display : grid;
grid-template-areas : 'previousPage currentPage nextPage'; grid-template-areas : 'previousPage currentPage nextPage';
grid-template-columns : 50px 1fr 50px; grid-template-columns : 50px 1fr 50px;
gap:20px;
place-items : center; place-items : center;
width : auto; width : auto;
translate : -50%; translate : -50%;
font-size:15px;
&:last-child { top : unset; }
.pages { .pages {
display : flex; display : flex;
grid-area : currentPage; grid-area : currentPage;
gap:1em;
justify-content : space-evenly; justify-content : space-evenly;
width : 100%; width : 100%;
height : 100%; height : 100%;
padding : 5px 8px;
text-align : center; text-align : center;
.pageNumber { .pageNumber {
margin-inline : 1vw; place-content:center;
min-width:2em;
width:fit-content;
font-family : 'Open Sans'; font-family : 'Open Sans';
font-weight : 900; font-weight : 900;
color : white; color : white;