From 422bc00adee0c4c80611c9d921a6fe601b6038cd Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Mon, 23 Feb 2026 11:36:04 +0200
Subject: [PATCH] ui/list & grid view: add block margin for the bottom pager

---
 .../src/widgets/collections/legacy/ListOrGridView.css     | 4 ++++
 .../src/widgets/collections/legacy/ListOrGridView.tsx     | 8 ++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/apps/client/src/widgets/collections/legacy/ListOrGridView.css b/apps/client/src/widgets/collections/legacy/ListOrGridView.css
index 0f963f0d59..552599ffda 100644
--- a/apps/client/src/widgets/collections/legacy/ListOrGridView.css
+++ b/apps/client/src/widgets/collections/legacy/ListOrGridView.css
@@ -13,6 +13,10 @@
         flex-wrap: wrap;
         gap: 10px;
     }
+
+    .note-list-bottom-pager {
+        margin-block: 8px;
+    }
 }
 
 /* #region List view / Grid view common styles */
diff --git a/apps/client/src/widgets/collections/legacy/ListOrGridView.tsx b/apps/client/src/widgets/collections/legacy/ListOrGridView.tsx
index 86958615e7..9f95fdd635 100644
--- a/apps/client/src/widgets/collections/legacy/ListOrGridView.tsx
+++ b/apps/client/src/widgets/collections/legacy/ListOrGridView.tsx
@@ -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>
     );