ui/list & grid view: add block margin for the bottom pager

This commit is contained in:
Adorian Doran 2026-02-23 11:36:04 +02:00
parent 8edf5483a6
commit 422bc00ade
2 changed files with 8 additions and 4 deletions

View File

@ -13,6 +13,10 @@
flex-wrap: wrap;
gap: 10px;
}
.note-list-bottom-pager {
margin-block: 8px;
}
}
/* #region List view / Grid view common styles */

View File

@ -33,7 +33,7 @@ export function ListView({ note, noteIds: unfilteredNoteIds, highlightedTokens }
<div className="note-list list-view">
<CollectionProperties
note={note}
centerChildren={<Pager {...pagination} />}
centerChildren={<Pager className="note-list-top-pager" {...pagination} />}
/>
{ noteIds.length > 0 && <div className="note-list-wrapper">
@ -49,7 +49,7 @@ export function ListView({ note, noteIds: unfilteredNoteIds, highlightedTokens }
))}
</Card>
<Pager {...pagination} />
<Pager className="note-list-bottom-pager" {...pagination} />
</div>}
</div>
);
@ -66,7 +66,7 @@ export function GridView({ note, noteIds: unfilteredNoteIds, highlightedTokens }
<div className="note-list grid-view">
<CollectionProperties
note={note}
centerChildren={<Pager {...pagination} />}
centerChildren={<Pager className="note-list-top-pager" {...pagination} />}
/>
<div className="note-list-wrapper">
@ -82,7 +82,7 @@ export function GridView({ note, noteIds: unfilteredNoteIds, highlightedTokens }
))}
</div>
<Pager {...pagination} />
<Pager className="note-list-bottom-pager" {...pagination} />
</div>
</div>
);