Skip to content

A conversation reads at reading size #551

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
WaylandYang merged 1 commit into from
Sep 9, 2026
+10 −5
Merged

A conversation reads at reading size #551

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions web/DESIGN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ Utopia's chrome is neutral dark glass: Geist for text, Marcellus for the wordmar
|---|---|---|
| `text-fine` | 11 / 16 | metadata, chip text, table headers, hints under a control |
| `text-small` | 12 / 18 | secondary text, dense rows, captions |
| `text-body` | 13 / 20 | everything else: prose, controls, menus |
| `text-title` | 15 / 22 | section and dialog titles |
| `text-body` | 14 / 22 | everything else: prose, controls, menus |
| `text-title` | 16 / 24 | section and dialog titles; chat reads at this step |
| `text-display` | 20 / 28 | the page title, and only that |

No `text-xs`/`text-sm`, no `text-[11px]`. If a size between two steps seems necessary, the step is wrong for the element, not the scale for the size. Weight is `font-medium` for controls and titles, `font-semibold` only on the primary button; `font-bold` is not used in chrome. Numbers in chrome are Geist with `u-num` (tabular figures), never monospace; `font-mono` is for keys, ids, code and URLs.
Expand Down
7 changes: 5 additions & 2 deletions web/src/pages/Chat.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -748,7 +748,10 @@ function TurnView({ turn, live }: { turn: Turn; live?: boolean }) {
if (turn.role === "user") {
return (
<div className="flex justify-end">
<div className="u-bubble-user max-w-[85%] rounded-panel px-4 py-2 text-body whitespace-pre-wrap text-ink">
{/* **对话按 title 那一档读**（16/24，不是正文的 14/22）。这一页是这个
产品里唯一一块拿来"读"的长文本，其余都是表格、清单、面板里的字段，
14px 在那些地方是对的，成段读就偏小了。仍在五档之内，不新增字号 */}
<div className="u-bubble-user max-w-[85%] rounded-panel px-4 py-2 text-title whitespace-pre-wrap text-ink">
{turn.content}
</div>
</div>
Expand All @@ -761,7 +764,7 @@ function TurnView({ turn, live }: { turn: Turn; live?: boolean }) {
return (
<div className="max-w-[95%]">
{/* agent 回复无气泡：正文直接落在画布上（用户消息保留气泡以区分角色） */}
<div className="py-1 text-body text-ink leading-relaxed">
<div className="py-1 text-title text-ink leading-relaxed">
{/* **轨迹按发生的顺序穿在正文里。**
模型是边说边查的：说一句、调一次、再说一句。把调用整块提到最前面，
读起来就成了「先查七次再一口气说完」——那不是它做的事，而且相邻两次
Expand Down
4 changes: 3 additions & 1 deletion web/src/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -998,9 +998,11 @@ select.input-dark option {
}

/* ---- interactive accents ---- */
/* 自己发的那条。**只有一块底，没有描边**：这一屏上带框的东西都是可以操作的
（输入框、控件、卡片），一条已经说完的话不是其中之一，给它描边就是在暗示
还能点。角色靠这块 8% 的底区分就够了 */
.u-bubble-user {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.14);
}
.u-highlight {
border-color: rgba(255, 255, 255, 0.45) !important;
Expand Down
Loading