页面UI优化

index.html

@@ -69,10 +69,12 @@
         box-shadow: 2px 0 5px rgba(0, 0, 0, 0.04);
         z-index: 10;
         height: 100%;
+        left: 0px;
       }
 
       .sidebar.collapsed {
-        width: 0;
+        left: -260px;
+        /* width: 0; */
         overflow: hidden;
       }
 
@@ -159,15 +161,18 @@
 
       /* 收起按钮（独立漂浮在左边） */
       .toggle-btn {
+        display: flex;
+        justify-content: center;
+        align-items: center;
         position: absolute;
-        top: 10px;
+        top: 7px;
         left: 190px;
         background: #0057ff;
         color: #fff;
         border: none;
         border-radius: 50%;
-        width: 40px;
-        height: 40px;
+        width: 28px;
+        height: 28px;
         font-size: 18px;
         cursor: pointer;
         box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
@@ -565,6 +570,11 @@
         .sidebar.sidebar.collapsed>.toggle-btn {
           position: fixed;
           right: 10px !important;
+          width: 28px;
+          height: 28px;
+          display: flex;
+          justify-content: center;
+          align-items: center;
         }
 
         .chat-container {
@@ -1909,9 +1919,17 @@
       }
 
       document.addEventListener('click', (e) => {
+        console.log(toggleButton.contains(e.target), panel.contains(e.target))
         if (!toggleButton.contains(e.target) && !panel.contains(e.target)) {
           panel.classList.remove('show');
         }
+        if (!sidebar.contains(e.target)) {
+          if (!sidebar.classList.contains("collapsed")) {
+            sidebar.classList.add("collapsed");
+            toggleBtn.style.left = "10px"; // 收起后
+
+          }
+        }
       });
 
       // 阻止点击面板本身关闭