A user on a dark OS who launches OpenPencil currently gets a pure-white
canvas flash into their dark desktop every time — visually jarring and
eye-straining in low light. Upstream has no theme system at all, so
this change defers to the OS `prefers-color-scheme` for newly-created
pages only.
Changes:
- Add `CANVAS_BG_COLOR_DARK` (#2c2c2c, matching Figma's dark-mode
canvas) next to the existing light `CANVAS_BG_COLOR`.
- Add `getDefaultCanvasBgColor()` helper that reads
`matchMedia('(prefers-color-scheme: dark)')` once per call.
- Use the helper in `editor/create.ts` (initial editor state) and
`editor/pages.ts` (page-switch reset). Both are new-page
initializers.
Deliberately untouched:
- `io/formats/fig/export.ts` still writes the static light
`CANVAS_BG_COLOR` as the page `backgroundColor`. If a dark-theme
user's exports forced darkness on recipients, files wouldn't be
portable. The serialization path stays neutral.
- `canvas/renderer.ts` default — only a fallback when state is
missing `pageColor`; effectively dead once `create.ts` runs.
- Per-page ColorInput in `PageSection.vue` remains the manual
override for any user preference.
Companion colors (rulers, selection, snap) were already dark-
friendly values and need no adjustment — rulers become slightly more
legible on dark canvas than they were on light.
Tested on Arch + KDE Plasma (dark) + WebKit2GTK 2.52 + Mesa 26:
new pages render ~#2c2c2c, switching to light OS theme flips back
to #f5f5f5 on next launch, saved-and-reopened files keep the light
export value (confirming the serialization boundary).
|
||
|---|---|---|
| .. | ||
| assets | ||
| src | ||
| package.json | ||
| tsconfig.json | ||
| tsdown.config.ts | ||