Settings: Appearance page #320

Closed
opened 2026-10-07 20:43:24 -04:00 by Salastil · 1 comment
Owner

The only appearance option is Classic/Comfy/Bubbles on the General page. Discord/Slack/Element offer font scale, density, motion and timestamp options.

Add an Appearance page: message layout (moved here), font scale/zoom (webContents.setZoomFactor via main), density (compact/cozy spacing), reduce motion, 12/24-hour and relative timestamps. Dark only for v1.0 - the token work leaves room for a light theme later.

Part of the v1.0 UI pass.

The only appearance option is Classic/Comfy/Bubbles on the General page. Discord/Slack/Element offer font scale, density, motion and timestamp options. **Add an Appearance page:** message layout (moved here), font scale/zoom (`webContents.setZoomFactor` via main), density (compact/cozy spacing), reduce motion, 12/24-hour and relative timestamps. Dark only for v1.0 - the token work leaves room for a light theme later. _Part of the v1.0 UI pass._
Salastil added this to the v1.0 milestone 2026-10-07 20:43:24 -04:00
Salastil added the feature label 2026-10-07 20:43:24 -04:00
Author
Owner

Finished: fe6ad97.

Settings has an Appearance page, under App.

  • Messages: the display style (Classic / Comfy / Bubbles), moved here from General, and Spacing - Cozy or Compact. Compact is a 32px picture, no padding between a run's lines and less air above each new speaker, so more fits on the screen.
  • Size: a Zoom slider, 80-160% in 5% steps with a Reset, applied live and on every start through the preload (webFrame.setZoomFactor), so a popped-out window follows it too.
  • Time: Clock - 24-hour (as it has always been), 12-hour, or System - and the relative-timestamps switch, moved here from General. The clock applies to the time beside messages and to relative times' "Yesterday at…".
  • Motion: Reduce motion switches off transitions and animations app-wide (an attribute on the root with the same effect as the system's own request, which is still honoured).
  • All stored as prefs (appearance.*, display.hourFormat) and read by the app shell. Dark only for v1.0, as the issue says; the tokens leave room for a light theme.
  • Checked: the page, and a window restarted with compact + 12-hour + 115% in the second picture.

Page - before (left: the one option, buried in General), after (right):

page

Applied - before (left), after (right: compact spacing, 12-hour times, 115% zoom):

applied

Finished: [fe6ad97](https://git.salastil.com/Salastil/moho/commit/fe6ad97dae75a78a893fb5cb93714c2b83ed8cea). Settings has an Appearance page, under App. - **Messages:** the display style (Classic / Comfy / Bubbles), moved here from General, and **Spacing** - Cozy or Compact. Compact is a 32px picture, no padding between a run's lines and less air above each new speaker, so more fits on the screen. - **Size:** a **Zoom** slider, 80-160% in 5% steps with a Reset, applied live and on every start through the preload (`webFrame.setZoomFactor`), so a popped-out window follows it too. - **Time:** **Clock** - 24-hour (as it has always been), 12-hour, or System - and the relative-timestamps switch, moved here from General. The clock applies to the time beside messages and to relative times' "Yesterday at…". - **Motion:** **Reduce motion** switches off transitions and animations app-wide (an attribute on the root with the same effect as the system's own request, which is still honoured). - All stored as prefs (`appearance.*`, `display.hourFormat`) and read by the app shell. Dark only for v1.0, as the issue says; the tokens leave room for a light theme. - Checked: the page, and a window restarted with compact + 12-hour + 115% in the second picture. Page - before (left: the one option, buried in General), after (right): ![page](https://git.salastil.com/attachments/df8e40d4-e45a-4d91-b5a6-31b742ecea75) Applied - before (left), after (right: compact spacing, 12-hour times, 115% zoom): ![applied](https://git.salastil.com/attachments/1a0c8160-69cc-4373-8bbf-93ee7dc22f65)
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Salastil/moho#320