From f93e52611e7bf9e4269df181ef40fc85c7490a49 Mon Sep 17 00:00:00 2001 From: Gigi Date: Sun, 19 Oct 2025 22:48:17 +0200 Subject: [PATCH] style: make compact cards even more compact - Reduce padding from 0.5rem to 0.25rem vertically - Reduce compact row height from 28px to 24px - Reduce gap between compact cards from 0.5rem to 0.25rem - Creates a tighter, more space-efficient list layout --- src/styles/components/cards.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/styles/components/cards.css b/src/styles/components/cards.css index 57bc563f..8a350e5b 100644 --- a/src/styles/components/cards.css +++ b/src/styles/components/cards.css @@ -32,7 +32,7 @@ .individual-bookmarks h4 { margin: 0 0 1rem 0; font-size: 1rem; color: var(--color-text); } .bookmarks-grid { display: flex; flex-direction: column; gap: 1rem; width: 100%; max-width: 100%; } -.bookmarks-grid.bookmarks-compact { gap: 0.5rem; } +.bookmarks-grid.bookmarks-compact { gap: 0.25rem; } .bookmarks-grid.bookmarks-large { gap: 1.5rem; } @media (max-width: 768px) { .bookmarks-grid { gap: 0.75rem; } @@ -44,9 +44,9 @@ .individual-bookmark:hover { border-color: var(--color-border); background: var(--color-bg-elevated); } /* Compact view */ -.individual-bookmark.compact { padding: 0.5rem 0.5rem; background: transparent; border: none !important; border-radius: 0; box-shadow: none; width: 100%; max-width: 100%; overflow: hidden; } +.individual-bookmark.compact { padding: 0.25rem 0.5rem; background: transparent; border: none !important; border-radius: 0; box-shadow: none; width: 100%; max-width: 100%; overflow: hidden; } .individual-bookmark.compact:hover { background: var(--color-bg-elevated); transform: none; box-shadow: none; border: none !important; } -.compact-row { display: flex; align-items: center; gap: 0.5rem; height: 28px; width: 100%; min-width: 0; overflow: hidden; } +.compact-row { display: flex; align-items: center; gap: 0.5rem; height: 24px; width: 100%; min-width: 0; overflow: hidden; } .compact-thumbnail { width: 24px; height: 24px; flex-shrink: 0; border-radius: 4px; overflow: hidden; background: var(--color-bg-elevated); display: flex; align-items: center; justify-content: center; } .compact-thumbnail img { width: 100%; height: 100%; object-fit: cover; } .compact-row.clickable { cursor: pointer; }