From f30c894c87351bb2c71c976787251663092c2e48 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Wed, 15 Oct 2025 16:19:34 +0200
Subject: [PATCH] fix: align add bookmark button with section heading

- Added matching padding to bookmark-section-action button
- Button now has same vertical padding as section title (1.5rem top, 0.75rem bottom)
- Also handles first section case with reduced padding (0.5rem top)
- Removed unnecessary marginBottom from flex container
---
 src/components/BookmarkList.tsx | 5 +++--
 src/styles/components/cards.css | 6 ++++++
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/BookmarkList.tsx b/src/components/BookmarkList.tsx
index 9a4d536f..a69ccf0c 100644
--- a/src/components/BookmarkList.tsx
+++ b/src/components/BookmarkList.tsx
@@ -167,14 +167,15 @@ export const BookmarkList: React.FC<BookmarkListProps> = ({
           />
           {sections.filter(s => s.items.length > 0).map(section => (
             <div key={section.key} className="bookmarks-section">
-              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '0.75rem' }}>
-                <h3 className="bookmarks-section-title" style={{ margin: 0 }}>{section.title}</h3>
+              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
+                <h3 className="bookmarks-section-title" style={{ margin: 0, padding: '1.5rem 0.5rem 0.75rem', flex: 1 }}>{section.title}</h3>
                 {section.key === 'web' && activeAccount && (
                   <CompactButton
                     icon={faPlus}
                     onClick={() => setShowAddModal(true)}
                     title="Add web bookmark"
                     ariaLabel="Add web bookmark"
+                    className="bookmark-section-action"
                   />
                 )}
               </div>
diff --git a/src/styles/components/cards.css b/src/styles/components/cards.css
index 20726263..20b9ac43 100644
--- a/src/styles/components/cards.css
+++ b/src/styles/components/cards.css
@@ -21,6 +21,12 @@
   border-top: none; 
   padding-top: 0.5rem !important; 
 }
+.bookmark-section-action {
+  padding: 1.5rem 0.5rem 0.75rem;
+}
+.bookmarks-section:first-of-type .bookmark-section-action {
+  padding-top: 0.5rem;
+}
 
 .individual-bookmarks { margin: 1rem 0; }
 .individual-bookmarks h4 { margin: 0 0 1rem 0; font-size: 1rem; color: var(--color-text); }