优化导航栏缩小按钮

frontend/src/index.css

@@ -34,7 +34,7 @@ a {
   border-bottom: 1px solid #edf1f7;
   display: flex;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: space-between;
 }
 
 .app-content {
@@ -77,28 +77,25 @@ a {
   min-height: 100%;
 }
 
-.app-sidebar__collapse {
-  position: absolute;
-  top: 42px;
-  right: -18px;
-  z-index: 2;
+.app-header__collapse {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 36px;
-  height: 36px;
-  border: 1px solid #e8eef6;
-  border-radius: 999px;
-  background: #fff;
-  color: #9aa4b2;
-  box-shadow: 0 8px 18px rgba(42, 71, 105, 0.12);
+  flex: 0 0 26px;
+  width: 26px;
+  height: 26px;
+  border: 1px solid #dce7f3;
+  border-radius: 7px;
+  background: rgba(255, 255, 255, 0.74);
+  color: #7d8a99;
   cursor: pointer;
-  transition: color 0.16s ease, box-shadow 0.16s ease;
+  transition: border-color 0.16s ease, background 0.16s ease, color 0.16s ease;
 }
 
-.app-sidebar__collapse:hover {
+.app-header__collapse:hover {
+  border-color: #b8d7ff;
+  background: #fff;
   color: #1677ff;
-  box-shadow: 0 10px 22px rgba(22, 119, 255, 0.16);
 }
 
 .app-sidebar__brand {
@@ -127,6 +124,8 @@ a {
 }
 
 .app-sidebar__brand-text {
+  min-width: 0;
+  flex: 1;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;