k1nq/TREK
1
0
Fork 0
mirror of https://github.com/mauriceboe/TREK.git synced 2026-06-30 18:46:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(appearance): granular per-size text scaling with live preview

Browse Source 
The text-size control now adjusts each size class (Large / Medium / Normal / Small) independently as well as all-at-once. Inline px sizes are mapped to a class by their value, so the per-class sliders reach real content; each class variable = global factor x its per-class factor (no double-scaling with the root font-size that handles rem text). The settings UI gains a live preview that resizes as you drag, and the four size sliders sit behind a clear toggle.
This commit is contained in:
Maurice
2026-06-29 12:15:33 +02:00
committed by Maurice
parent bb8f4d4e5e
commit 741639edf0
136 changed files with 1217 additions and 1002 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/public/theme-boot.js
+6 -8
View File
@@ -42,14 +42,12 @@
}
var ts = s.typeScale || {};
setScale('--fs-scale-title', ts.title);
setScale('--fs-scale-subtitle', ts.subtitle);
setScale('--fs-scale-body', ts.body);
setScale('--fs-scale-caption', ts.caption);
if (typeof s.fontScale === 'number' && s.fontScale !== 1) {
root.style.fontSize = s.fontScale * 100 + '%';
root.style.setProperty('--fs-scale-text', String(s.fontScale));
}
var fs = typeof s.fontScale === 'number' ? s.fontScale : 1;
setScale('--fs-scale-title', fs * (ts.title || 1));
setScale('--fs-scale-subtitle', fs * (ts.subtitle || 1));
setScale('--fs-scale-body', fs * (ts.body || 1));
setScale('--fs-scale-caption', fs * (ts.caption || 1));
if (fs !== 1) root.style.fontSize = fs * 100 + '%';
function setScale(name, v) {
if (typeof v === 'number' && v !== 1) root.style.setProperty(name, String(v));