From: Codebuddy <codebuddy@localhost>
Date: Mon, 17 Aug 2026 05:44:08 +0000 (+0800)
Subject: fix(ui): 顶栏按钮防裁切换行；帮助按钮仅保留列表页（黑底白字红图标），移除会话页帮助按钮
X-Git-Url: http://acesimba.cloud/gitweb/?a=commitdiff_plain;h=2c89ce288fa624091ba0cd821af30beebe553e1b;p=codebuddy-web.git

fix(ui): 顶栏按钮防裁切换行；帮助按钮仅保留列表页（黑底白字红图标），移除会话页帮助按钮
---

diff --git a/frontend/index.html b/frontend/index.html
index eeddea9..e0cb4fa 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -42,7 +42,7 @@ body { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; heigh
 
 /* 顶栏 */
 .top-bar {
-  display: flex; justify-content: space-between; align-items: center;
+  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; row-gap: 8px;
   padding: calc(8px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) 8px calc(16px + env(safe-area-inset-left));
   background: rgba(0,0,0,0.3); border-bottom: 1px solid rgba(255,255,255,0.1);
   font-size: 15px; flex-shrink: 0; gap: 12px;
@@ -53,7 +53,7 @@ body { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; heigh
 .top-bar .dot.disconnected { background: #ff6b6b; box-shadow: 0 0 6px #ff6b6b; }
 .top-bar .task-name { color: #4ecca3; font-weight: 600; }
 .top-bar .task-cwd { color: #888; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.top-bar .actions { display: flex; gap: 8px; flex-shrink: 0; }
+.top-bar .actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; flex-shrink: 0; }
 .top-bar .action-btn {
   padding: 4px 12px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.15);
   background: rgba(255,255,255,0.05); color: #ccc; font-size: 14px; cursor: pointer;
@@ -109,6 +109,12 @@ body { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; heigh
 }
 .picker-header h2 { font-size: 22px; color: #fff; }
 .picker-header h2 small { color: #888; font-size: 14px; font-weight: normal; margin-left: 10px; }
+.picker-header .action-btn {
+  padding: 6px 14px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.15);
+  background: #1a1a2e; color: #fff; font-size: 14px; cursor: pointer; transition: all 0.15s;
+}
+.picker-header .action-btn:hover { background: #2a2a40; }
+.picker-header .action-btn .ico { color: #ff5b5b; margin-right: 2px; }
 .picker-body { flex: 1; overflow: auto; padding: 28px; }
 .picker-main { display: flex; flex: 1; min-height: 0; }
 #skills-sidebar {
@@ -236,7 +242,7 @@ body { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; heigh
     <h2>任务清单 <small id="picker-subtitle"></small></h2>
     <div style="display:flex; gap:16px; align-items:center;">
       <label class="picker-toggle"><input type="checkbox" id="show-all-tasks"> 显示全部任务</label>
-      <button class="action-btn" id="btn-help-picker" title="设计说明 / 帮助" onclick="window.open('/help','_blank')">❓ 帮助</button>
+      <button class="action-btn" id="btn-help-picker" title="设计说明 / 帮助" onclick="window.open('/help','_blank')"><span class="ico">❓</span> 帮助</button>
       <button class="action-btn" id="btn-logout-picker">退出登录</button>
     </div>
   </div>
@@ -309,7 +315,6 @@ body { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; heigh
       <button class="action-btn" id="btn-list" title="打开任务列表">≡ 列表</button>
       <button class="action-btn" id="btn-paste" title="粘贴文字或图片">📋 粘贴</button>
       <button class="action-btn" id="btn-skills" title="管理自定义 skill">🧩 技能</button>
-      <button class="action-btn" id="btn-help" title="设计说明 / 帮助" onclick="window.open('/help','_blank')">❓ 帮助</button>
       <button class="action-btn" id="btn-close" title="关闭窗口">✕ 关闭</button>
     </div>
   </div>