From 67fb8d0354caf427c2a89c7543a514f9a43941b9 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Mon, 22 Dec 2025 21:25:39 +0200
Subject: [PATCH] client/status bar panes: tweak

---
 apps/client/src/widgets/layout/StatusBar.css | 14 ++++++++++++--
 apps/client/src/widgets/layout/StatusBar.tsx |  8 +++++---
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/apps/client/src/widgets/layout/StatusBar.css b/apps/client/src/widgets/layout/StatusBar.css
index 52e7962d2d..e9ad2e2316 100644
--- a/apps/client/src/widgets/layout/StatusBar.css
+++ b/apps/client/src/widgets/layout/StatusBar.css
@@ -254,6 +254,10 @@
         }
     }
 
+    div.similar-notes-widget div.similar-notes-wrapper {
+        max-height: unset;
+    }
+
     button.select-button:not(:focus-visible) {
         outline: none;
     }
@@ -267,7 +271,7 @@
     .status-bar-pane-title-bar {
         display: flex;
         padding: 6px 12px;
-        background: #2d2d2d;
+        background: #272727;
         justify-content: space-between;
         align-items: center;
 
@@ -280,8 +284,14 @@
     }
 
     .status-bar-pane-content {
-        background: #363636;
+        border-bottom: 1px solid var(--main-border-color);
+        background: #181818;
         padding: 8px 12px;
+        
+        &.status-bar-pane-scrollable {
+            max-height: 40vh;
+            overflow-y: auto;
+        }
     }
 }
 
diff --git a/apps/client/src/widgets/layout/StatusBar.tsx b/apps/client/src/widgets/layout/StatusBar.tsx
index e49e9a030e..a52cc93231 100644
--- a/apps/client/src/widgets/layout/StatusBar.tsx
+++ b/apps/client/src/widgets/layout/StatusBar.tsx
@@ -271,7 +271,8 @@ function SimilarNotesPane({ note, similarNotesShown, setSimilarNotesShown }: Not
         <StatusBarPane title="Similar notes"
                        className="similar-notes-pane"
                        visible={similarNotesShown}
-                       setVisible={setSimilarNotesShown}>
+                       setVisible={setSimilarNotesShown}
+                       scrollable>
             <SimilarNotesTab note={note} />
         </StatusBarPane>
     );
@@ -454,16 +455,17 @@ interface StatusBarPaneParms {
     title: string;
     visible: boolean;
     setVisible?: (visible: boolean) => void;
+    scrollable?: boolean;
     className?: string;
 }
 
-function StatusBarPane({ children, title, visible, setVisible, className }: StatusBarPaneParms) {
+function StatusBarPane({ children, title, visible, setVisible, className, scrollable }: StatusBarPaneParms) {
     return <div className={clsx("status-bar-pane", className, {"hidden-ext": !visible})}>
         <div className="status-bar-pane-title-bar">
             <span className="status-bar-pane-title-bar-caption">{title}</span>
             <button class="icon-action bx bx-x" onClick={() => setVisible?.(false)}></button>
         </div>
-        <div class="status-bar-pane-content">
+        <div class={clsx("status-bar-pane-content", { "status-bar-pane-scrollable": scrollable })}>
             {children}
         </div>
     </div>