Skip to content

Add a "Chat text size" setting (Small / Default / Large) to Appearance #64

Description

@DragonnZhang

Problem or Motivation

OpenWork lets you change the app theme, color theme, font family,
language, reduce motion and (in-flight) conversation width — but there is
no way to change how large the conversation text is.

The only lever today is the OS-level app zoom wired to the View menu
(menu.ZOOM_IN/OUT/RESETwebContents.setZoomFactor, see
apps/electron/src/main/handlers/system.ts). That scales the entire UI
sidebar, toolbar, composer, icons, spacing — not just the reading text, and it
is a transient window zoom, not a persisted appearance preference.

This is a recurring, unmet ask across comparable desktop clients. Users
specifically want a text-size control that adjusts typographic size — body
copy, message content — while leaving the app chrome at its native scale
:

  • Claude Desktop — Appearance exposes a "Chat font" control, and there are
    standing feature requests (anthropics/claude-code #50543, #48887) for a
    text-size control that scales only message typography, not the whole UI.
  • ChatGPT desktop — long-standing user requests for a chat font-size option
    (the app currently has none, driving users to browser extensions).

OpenWork's otherwise rich Appearance → Interface section (rich tool
descriptions, reduce motion) is missing this common accessibility/readability
affordance.

Proposed Solution

Add a "Chat text size" segmented control to Settings → Appearance →
Interface
, right below the existing "Reduce motion" toggle, with three options:

  • Small — 0.9× the current text size,
  • Default — the current size (1×, no visual change for existing users),
  • Large — 1.15× for easier reading.

Behavior (mirrors the merged ReduceMotionContext pattern — renderer-only, no
backend / qwen-code change):

  • A new ChatTextSizeProvider persists the choice in localStorage
    (craft-chat-text-size) and reflects it onto <html> as
    data-chat-text-size="small|medium|large".
  • Global CSS in index.css maps that attribute to a --chat-font-scale custom
    property (0.9 / 1 / 1.15).
  • The chat transcript container in ChatDisplay.tsx carries a chat-text-scope
    class whose font-size: calc(1em * var(--chat-font-scale)) multiplies the
    inherited message text size. Because it is em-relative it is exactly
    neutral at Default and scales the conversation body copy up/down without
    touching the sidebar, top bar, composer, or icons.
  • New i18n keys added across all 7 locales.

Feasibility

Frontend-only. No qwen-code backend involvement: it is a renderer preference
(localStorage) applied via an <html> data attribute + a CSS variable consumed
by the transcript container, following the exact idiom already shipped for
Reduce motion (#50/#51). Nothing about message content, streaming, or the agent
runtime changes.

Acceptance criteria (what the CDP assertion will verify)

Driving the real UI over CDP (Settings → Appearance → Chat text size control),
with no seeded session:

  1. The segmented control renders and starts on Default (aria-checked).
  2. Selecting Large sets data-chat-text-size="large" on <html>, persists
    "large" to localStorage['craft-chat-text-size'], and resolves
    --chat-font-scale to 1.15.
  3. A probe element carrying the real chat-text-scope class has its computed
    font-size measurably larger at Large than at Default
    (proving the CSS the
    transcript uses produces a real pixel-level text-size change, not just an
    attribute flip).
  4. Selecting Small → scale 0.9 and a computed font-size smaller than
    Default; selecting Default reverts the attribute/scale — proving apply,
    change, and revert.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions