From 839b399a0dae3c885c8a5cf9fb6710b103ac0626 Mon Sep 17 00:00:00 2001 From: Muse Date: Sat, 14 Nov 2026 15:25:27 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E6=94=B6=E8=B5=B7=E6=8C=89=E9=92=AE?= =?UTF-8?q?=E4=B8=8E=E9=80=89=E4=B8=AD=E6=80=81=E7=BB=9F=E4=B8=80=EF=BC=88?= =?UTF-8?q?=E4=BE=A7=E6=A0=8F=E9=A1=B5=E7=AD=BE=E6=94=B9=206px=20=E5=9C=86?= =?UTF-8?q?=E8=A7=92=E7=9F=A9=E5=BD=A2=E3=80=81=E9=A1=B6=E9=83=A8=E8=8F=9C?= =?UTF-8?q?=E5=8D=95=E9=80=89=E4=B8=AD=E5=BA=95=E8=89=B2=E4=B8=8E=E4=BE=A7?= =?UTF-8?q?=E6=A0=8F=E4=B8=80=E8=87=B4=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 收起按钮此前被 .sidebar-tabs button 的 flex:1 与胶囊圆角压过长成宽胶囊， 改为 26px 方形图标钮；侧栏页签选中效果对齐顶部菜单（6px 圆角），选中 背景色保持 --accent-weak；顶部菜单 .open 背景由 --hover 改为 --accent-weak， 与侧栏选中同色（悬停仍为 --hover）。 --- src/styles.css | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/styles.css b/src/styles.css index a02b133..0edd8bf 100644 --- a/src/styles.css +++ b/src/styles.css @@ -45,7 +45,8 @@ button { font: inherit; color: inherit; } .menubar { display: flex; padding: 2px 6px; background: var(--bg); border-bottom: 1px solid var(--border); user-select: none; position: relative; z-index: 40; } .menu { position: relative; } .menu-title { border: 0; background: transparent; padding: 4px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; } -.menu-title:hover, .menu-title.open { background: var(--hover); } +.menu-title:hover { background: var(--hover); } +.menu-title.open { background: var(--accent-weak); } .menu-dropdown { position: absolute; top: 100%; left: 0; min-width: 250px; background: var(--bg-editor); border: 1px solid var(--border); border-radius: 8px; padding: 5px; box-shadow: 0 8px 24px rgba(0,0,0,0.13); } .menu-item { display: flex; align-items: center; width: 100%; border: 0; background: transparent; padding: 6px 8px; border-radius: 6px; cursor: pointer; font-size: 13px; text-align: left; } .menu-item:hover:not(:disabled) { background: var(--accent-weak); } @@ -70,8 +71,8 @@ button { font: inherit; color: inherit; } .context-menu { position: fixed; z-index: 90; background: var(--bg-editor); border: 1px solid var(--border); border-radius: 8px; padding: 5px; box-shadow: 0 8px 24px rgba(0,0,0,0.13); display: flex; flex-direction: column; min-width: 170px; } .context-menu button:disabled { opacity: 0.45; cursor: default; } .context-menu button:disabled:hover { background: transparent; } -.sidebar-collapse { margin-left: auto; background: transparent; border: 0; color: var(--text-dim); cursor: pointer; display: flex; align-items: center; padding: 4px 6px; border-radius: 6px; } -.sidebar-collapse:hover { color: var(--text); background: var(--accent-weak); } +.sidebar-tabs .sidebar-collapse { flex: none; width: 26px; height: 26px; margin-left: auto; background: transparent; border: 0; color: var(--text-dim); cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; border-radius: 6px; } +.sidebar-tabs .sidebar-collapse:hover { color: var(--text); background: var(--hover); } .sidebar-expand { position: absolute; left: 10px; top: 10px; z-index: 35; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; background: var(--bg-panel); border: 1px solid var(--border); border-radius: 7px; color: var(--text-dim); cursor: pointer; } .sidebar-expand:hover { color: var(--text); border-color: var(--accent); } .source-toggle { position: absolute; right: 14px; bottom: 14px; z-index: 35; background: var(--bg-panel); color: var(--text-dim); border: 1px solid var(--border); border-radius: 999px; padding: 5px 13px; font-size: 12.5px; cursor: pointer; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.10); } @@ -84,7 +85,7 @@ button { font: inherit; color: inherit; } .main { flex: 1; display: flex; min-height: 0; } .sidebar { flex: 1; display: flex; flex-direction: column; background: var(--bg-panel); border-right: 1px solid var(--border); min-width: 0; } .sidebar-tabs { display: flex; gap: 4px; padding: 8px 10px 4px; } -.sidebar-tabs button { flex: 1; border: 0; background: transparent; padding: 5px 0; border-radius: 999px; cursor: pointer; font-size: 13px; color: var(--text-dim); } +.sidebar-tabs button { flex: 1; border: 0; background: transparent; padding: 5px 0; border-radius: 6px; cursor: pointer; font-size: 13px; color: var(--text-dim); } .sidebar-tabs button.active { background: var(--accent-weak); color: var(--text); } .outline, .filetree { overflow-y: auto; padding: 6px 8px 16px; } .outline-item { display: block; width: 100%; text-align: left; border: 0; background: transparent; padding: 4px 6px; border-radius: 6px; cursor: pointer; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }