From 43decb0ed943e6f414d8ffa9c172f32ae55d524f Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Fri, 27 Dec 2024 16:11:47 -0800
Subject: [PATCH] Fix: correct iconsOnly bookmark group spacing (#4502)

---
 src/components/bookmarks/group.jsx | 4 ++--
 src/components/bookmarks/list.jsx  | 7 +++----
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/bookmarks/group.jsx b/src/components/bookmarks/group.jsx
index 9deb1b6a299..b90ac8db1e3 100644
--- a/src/components/bookmarks/group.jsx
+++ b/src/components/bookmarks/group.jsx
@@ -24,9 +24,9 @@ export default function BookmarksGroup({
     <div
       key={bookmarks.name}
       className={classNames(
-        "bookmark-group",
+        "bookmark-group flex-1 overflow-hidden",
         layout?.style === "row" ? "basis-full" : "basis-full md:basis-1/4 lg:basis-1/5 xl:basis-1/6",
-        layout?.header === false ? "flex-1 px-1 -my-1 overflow-hidden" : "flex-1 p-1 overflow-hidden",
+        layout?.header === false ? "px-1" : "p-1 pb-0",
       )}
     >
       <Disclosure defaultOpen={!(layout?.initiallyCollapsed ?? groupsInitiallyCollapsed) ?? true}>
diff --git a/src/components/bookmarks/list.jsx b/src/components/bookmarks/list.jsx
index 194bb43af32..8f41afdfa25 100644
--- a/src/components/bookmarks/list.jsx
+++ b/src/components/bookmarks/list.jsx
@@ -5,15 +5,14 @@ import { columnMap } from "../../utils/layout/columns";
 import Item from "components/bookmarks/item";
 
 export default function List({ bookmarks, layout, bookmarksStyle }) {
-  let classes =
-    layout?.style === "row" ? `grid ${columnMap[layout?.columns]} gap-x-2` : "flex flex-col mt-3 bookmark-list";
+  let classes = layout?.style === "row" ? `grid ${columnMap[layout?.columns]} gap-x-2` : "flex flex-col bookmark-list";
   const style = {};
   if (layout?.iconsOnly || bookmarksStyle === "icons") {
-    classes = "grid gap-3 mt-3 bookmark-list";
+    classes = "grid gap-2 bookmark-list";
     style.gridTemplateColumns = "repeat(auto-fill, minmax(60px, 1fr))";
   }
   return (
-    <ul className={classNames(classes)} style={style}>
+    <ul className={classNames(classes, "mb-2", layout?.header === false ? "" : "mt-3")} style={style}>
       {bookmarks.map((bookmark) => (
         <Item
           key={`${bookmark.name}-${bookmark.href}`}