diff --git a/UI-DESIGN.md b/UI-DESIGN.md
index 4931d372..2451a7ed 100644
--- a/UI-DESIGN.md
+++ b/UI-DESIGN.md
@@ -293,9 +293,11 @@
- 浅色侧栏使用冰蓝灰表面,与白色主内容画布形成明确边界;深色侧栏使用比主画布略亮的蓝灰表面。
- 一级导航与最近会话之间、最近会话与底部账户区之间必须有可见结构分隔线。浅色主题使用 `--border-default`,深色主题可在可辨前提下使用 `--border-subtle`。
- 当前导航项和当前会话使用一致的淡蓝选中背景、强调色文字和中等字重,不额外描边或添加侧边标记;导航图标随选中状态使用强调色,悬停时保留选中状态。浅深主题遵循相同规则,强制颜色模式保留系统选中边框。
-- 固定导航行高至少 `36px`、行间距 `4px`,图标统一为 `16px`;导航与最近会话分隔线上下各留 `16px`。普通待办和待处理建议数量使用中性色徽标,不使用危险红色;徽标高度不得改变导航行高。搜索框获得内部焦点时显示完整焦点环。
+- 固定导航行高至少 `36px`、行间距 `4px`,图标统一为 `16px`;导航与会话区域之间、会话区域与底部入口之间的分隔线上下均各留 `16px`(`--space-4`)。普通待办和待处理建议数量使用中性色徽标,不使用危险红色;徽标高度不得改变导航行高。搜索框获得内部焦点时显示完整焦点环。
- 未选中项保持平整,不为每一行添加卡片边框或阴影。悬停反馈不得强于选中状态。
- 最近会话列表在精细指针设备上使用细原生滚动条,滑块使用 `--border-control`、轨道透明;强制颜色与粗指针设备保留系统默认。
+- 会话区域使用 `--surface-raised` 与主导航区分,浅色为白底,深色为相邻的深蓝灰底。不显示“最近会话”标题,保留区域的无障碍名称;搜索框固定在区域顶部,仅下方列表滚动。搜索框使用透明背景和 `--border-control` 边框,保留内部清除按钮与焦点环。
+- 窗口高度不超过 `600px` 时,侧栏允许整体纵向滚动,会话区域至少保留 `200px` 高度,避免搜索框、列表与底部入口相互覆盖。
- 最近会话的顺序不随流式输出增量反复变化;置顶与新消息排序遵守
[会话列表排序规则](./docs/features/application-tool-navigation/ui-design.md#会话置顶与操作菜单)。
- 项目选择器顶行保留项目切换与新建按钮;项目设置统一从下拉列表对应行的管理按钮进入,关闭后焦点返回项目选择器。
diff --git a/src/renderer/src/App.test.tsx b/src/renderer/src/App.test.tsx
index 78811e80..38b7d619 100644
--- a/src/renderer/src/App.test.tsx
+++ b/src/renderer/src/App.test.tsx
@@ -3054,6 +3054,10 @@ describe("App", () => {
]);
const { container } = render();
const search = await screen.findByLabelText("搜索对话");
+ const conversationSection = search.closest(".sidebar-conversations");
+ expect(conversationSection).toBeInTheDocument();
+ expect(search.closest(".conversation-list")).toBeNull();
+ expect(conversationSection?.querySelector(".conversation-list")).toBeInTheDocument();
const searchControls = within(search.parentElement!);
expect(
searchControls.queryByRole("button", { name: "清除搜索" }),
diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx
index 7e617b38..c8a6dbca 100644
--- a/src/renderer/src/App.tsx
+++ b/src/renderer/src/App.tsx
@@ -8716,31 +8716,6 @@ function App(): React.JSX.Element {
)}
-
-
- setSearchQuery(event.target.value)}
- placeholder={t("sidebar.searchPlaceholder")}
- value={searchQuery}
- />
- {searchQuery.length > 0 && (
-
- )}
-
-
+
+
+
+
+ setSearchQuery(event.target.value)}
+ placeholder={t("sidebar.searchPlaceholder")}
+ value={searchQuery}
+ />
+ {searchQuery.length > 0 && (
+
+ )}
+
+
-
{t("sidebar.recent")}
{!conversationLoadError &&
filteredConversations.map((conversation) => {
const conversationTasks =
@@ -9328,6 +9329,8 @@ function App(): React.JSX.Element {
) : null}
+
+