From 6f48762110968e040a29afea246fc0c6837b5ba1 Mon Sep 17 00:00:00 2001
From: Will Miao <13051207myq@gmail.com>
Date: Fri, 28 Feb 2025 21:37:00 +0800
Subject: [PATCH] Fix issue with incomplete display caused by too many folders

---
 static/css/layout.css | 27 ++++++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/static/css/layout.css b/static/css/layout.css
index f7c18208..cea96f6d 100644
--- a/static/css/layout.css
+++ b/static/css/layout.css
@@ -124,13 +124,16 @@
 .folder-tags-container {
     position: relative;
     width: 100%;
+    margin-bottom: 8px; /* Add margin to ensure space for the button */
 }
 
 .folder-tags {
     transition: max-height 0.3s ease, opacity 0.2s ease;
-    max-height: 200px;
+    max-height: 150px; /* Limit height to prevent overflow */
     opacity: 1;
-    overflow: hidden;
+    overflow-y: auto; /* Enable vertical scrolling */
+    padding-right: 40px; /* Make space for the toggle button */
+    margin-bottom: 5px; /* Add margin below the tags */
 }
 
 .folder-tags.collapsed {
@@ -184,11 +187,29 @@
 .folder-tags {
     display: flex;
     gap: 4px;
-    overflow-x: auto;
     padding: 2px 0;
     flex-wrap: wrap;
 }
 
+/* Add custom scrollbar for better visibility */
+.folder-tags::-webkit-scrollbar {
+    width: 6px;
+}
+
+.folder-tags::-webkit-scrollbar-track {
+    background: var(--card-bg);
+    border-radius: 3px;
+}
+
+.folder-tags::-webkit-scrollbar-thumb {
+    background: var(--border-color);
+    border-radius: 3px;
+}
+
+.folder-tags::-webkit-scrollbar-thumb:hover {
+    background: var(--lora-accent);
+}
+
 .tag {
     cursor: pointer;
     padding: 2px 8px;