feat(a11y): add a Text size control and an OpenDyslexic font option (#4210)

* feat(a11y): add a Text size control and an OpenDyslexic font option

Text size: a Theme > Font & Layout control (Default / Larger) that scales the whole UI via CSS zoom, so the many hard-coded px sizes scale too (density only moves the root font-size). Stored globally so it persists across theme switches; applied early in the boot script to avoid a flash. OpenDyslexic: a dyslexia-friendly self-hosted font (SIL OFL 1.1), bundled as woff2 alongside Fira Code/Inter and wired into the Font select. Reuses the existing density/font pattern end to end; no new colours, spacing, or component styles.

* fix(a11y): keep modals on-screen at Larger text size

Inline vh heights on .modal-content overrode the ui-scale-125 max-height
compensation, so Cookbook (and the email/doc/skills/PDF modals) overflowed
the viewport at 125% — pushing the header and close button off-screen.
Let the compensation own those heights.

* fix(a11y): keep PDF export modal at its original 86vh on Default size
This commit is contained in:
Tom
2026-06-22 12:53:46 +01:00
committed by GitHub
parent d36879bd50
commit 91b4171b3f
12 changed files with 182 additions and 8 deletions
+1 -1
View File
@@ -666,7 +666,7 @@ import * as Modals from './modalManager.js';
overlay.className = 'modal pdf-export-overlay';
overlay.style.cssText = 'pointer-events:auto;background:rgba(0,0,0,0.5);backdrop-filter:blur(4px);';
overlay.innerHTML = `
<div class="modal-content" style="width:min(780px,94vw);max-height:86vh;">
<div class="modal-content" style="width:min(780px,94vw);">
<div class="modal-header">
<h4>Export filled PDF</h4>
<button id="pdf-export-close" class="modal-close" title="Close">×</button>