Files
cc-web/.trellis/tasks/08-03-advanced-conversation-search/research/visual-spec.md

1.0 KiB
Raw Blame History

高级检索视觉规格

设计方向

沿用当前主题背景和语义 token,不创建新主题。高级检索是覆盖主工作区的独立操作面,参考图只提供构图、层级和结果阅读方式。

关键尺寸

  • 桌面面板:覆盖 .chat-main,最小宽度 0,顶栏 58–64px。
  • 内容最大宽度:960px;参考视口下左右 46–48px,窄屏下 18px。
  • 控件高度:24–30px;结果标题与正文间距 12–16px;结果垂直内边距 18–22px。
  • 摘要最多两段,每段最多约 220 字符;时间位于结果底部右侧。

状态覆盖

  • 未输入、输入不足两个字符、查询中、索引构建中、无结果、错误、有结果。
  • 长标题、长路径、长摘要、中文/英文、代码片段、特殊 HTML 字符。
  • 参考视口 733×673、常规桌面 1440×900、移动端 390×844。

安全

  • 标题和摘要只用文本节点渲染,高亮拆分 text/mark 节点。
  • 尊重 prefers-reduced-motion,移动端不使用大幅位移。