From 80acd26330a36eacb5463cce1ae5c4f65a8624e0 Mon Sep 17 00:00:00 2001
From: ranfdev <ranfdev@gmail.com>
Date: Sat, 11 Jun 2022 14:47:59 +0200
Subject: [PATCH] Use flex gaps for more consistency

---
 src/main/frontend/components/right_sidebar.cljs | 2 +-
 src/main/frontend/components/sidebar.cljs       | 8 ++++----
 src/main/frontend/components/sidebar.css        | 9 ++-------
 3 files changed, 7 insertions(+), 12 deletions(-)

diff --git a/src/main/frontend/components/right_sidebar.cljs b/src/main/frontend/components/right_sidebar.cljs
index 4b4544dc5..8bf9af0e6 100644
--- a/src/main/frontend/components/right_sidebar.cljs
+++ b/src/main/frontend/components/right_sidebar.cljs
@@ -221,7 +221,7 @@
        [:div
         (toggle)]]
 
-      [:.sidebar-item-list.flex-1.scrollbar-spacing
+      [:.sidebar-item-list.flex-1.scrollbar-spacing.flex.flex-col.gap-2
        (if @*anim-finished?
          (for [[idx [repo db-id block-type]] (medley/indexed blocks)]
            (rum/with-key
diff --git a/src/main/frontend/components/sidebar.cljs b/src/main/frontend/components/sidebar.cljs
index ce63e47a2..d9013cd89 100644
--- a/src/main/frontend/components/sidebar.cljs
+++ b/src/main/frontend/components/sidebar.cljs
@@ -47,7 +47,7 @@
   [:div.nav-content-item.is-expand
    {:class class}
    [:div.nav-content-item-inner
-    [:div.header.items-center.mb-1
+    [:div.header.items-center
      {:on-click (fn [^js/MouseEvent e]
                   (let [^js target (.-target e)
                         ^js parent (.closest target ".nav-content-item")]
@@ -223,11 +223,11 @@
                    (when (some (fn [sel] (boolean (.closest target sel)))
                                [".favorites .bd" ".recent .bd" ".dropdown-wrapper" ".nav-header"])
                      (close-modal-fn)))}
-     [:div.flex.flex-col.pb-4.wrap
-      [:nav.px-4.pt-1.space-y-1 {:aria-label "Sidebar"}
+     [:div.flex.flex-col.pb-4.wrap.gap-4
+      [:nav.px-4.flex.flex-col.gap-1 {:aria-label "Sidebar"}
        (repo/repos-dropdown)
 
-       [:div.nav-header
+       [:div.nav-header.flex.gap-1.flex-col
         (if-let [page (:page default-home)]
           (sidebar-item
             {:class            "home-nav"
diff --git a/src/main/frontend/components/sidebar.css b/src/main/frontend/components/sidebar.css
index a37934f1e..b206cf342 100644
--- a/src/main/frontend/components/sidebar.css
+++ b/src/main/frontend/components/sidebar.css
@@ -92,7 +92,6 @@
   a.item {
     user-select: none;
     transition: background-color .3s;
-    margin-bottom: 2px;
 
     > .ti {
       font-size: 16px;
@@ -116,8 +115,6 @@
   }
 
   .nav-content-item {
-    margin-top: 14px;
-
     &-inner {
       border-radius: 8px;
     }
@@ -242,7 +239,7 @@
     background-color: var(--ls-secondary-background-color);
 
     > .wrap {
-      margin-top: 50px;
+      margin-top: 52px;
     }
 
     .new-page {
@@ -472,9 +469,7 @@ html[data-theme='dark'] {
   }
 
   .sidebar-item {
-    padding-top: 24px;
-    padding-bottom: 24px;
-    margin-bottom: 8px;
+    @apply p-4;
 
     .close {
       transform: scale(0.8);