feat(fonts): deck-it's text, clock sizes and clock fonts

The Fonts page gets a deck-it section: deck-it's text size (the
override.deckit deck-it already read, with no row until now), and the
dim cover's clock time and date, following it at 8 and 1.6 times unless
given their own size (up to 400px). A Families section names the
clock's fonts, deckit-clock and deckit-date, saved under "family" in
fonts.json; deck-it reads both itself. The name field updates the draft
on every keystroke, since a click on Save takes no focus and an
editingFinished would never come.

The clock font fields leave the deck-it Dashboard page, which wrote
[tablet] keys deck-it no longer reads.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

1 files changed, 66 insertions, 5 deletions

diff --git a/desktop/modules/fonts/FontsPage.qml b/desktop/modules/fonts/FontsPage.qml
index fd2e672..1a58b11 100644
--- a/desktop/modules/fonts/FontsPage.qml
+++ b/desktop/modules/fonts/FontsPage.qml
@@ -11,6 +11,7 @@
 
 import QtQuick
 import "../.."
+import "../appearance" as A
 import "Fonts.js" as F
 
 // The base size, then a row per system and per section entry: what it is,
@@ -27,9 +28,9 @@ Column {
 
     spacing: 8
 
-    function clamp(px) { return Math.max(page.minPx, Math.min(page.maxPx, px)); }
+    function clamp(px, max) { return Math.max(page.minPx, Math.min(max, px)); }
     // A step of 1 in the row's own unit, so a pt row moves by whole points.
-    function step(px, unit, d) { return page.clamp(unit === "pt" ? F.toPx(Math.round(F.toPt(px)) + d) : Math.round(px) + d); }
+    function step(px, unit, d, max) { return page.clamp(unit === "pt" ? F.toPx(Math.round(F.toPt(px)) + d) : Math.round(px) + d, max); }
 
     component Small: Text {
         color: Theme.subtext
@@ -60,13 +61,14 @@ Column {
         property real px: 16
         property string unit: "px"
         property bool enabled: true
+        property real max: page.maxPx
         signal changed(real px)
         spacing: 6
         opacity: st.enabled ? 1 : 0.45
-        Button { text: "−"; enabled: st.enabled; onClicked: st.changed(page.step(st.px, st.unit, -1)) }
+        Button { text: "−"; enabled: st.enabled; onClicked: st.changed(page.step(st.px, st.unit, -1, st.max)) }
         Unit { text: F.round(st.px) + " px"; own: st.unit === "px" }
         Unit { text: F.round(F.toPt(st.px)) + " pt"; own: st.unit === "pt" }
-        Button { text: "+"; enabled: st.enabled; onClicked: st.changed(page.step(st.px, st.unit, 1)) }
+        Button { text: "+"; enabled: st.enabled; onClicked: st.changed(page.step(st.px, st.unit, 1, st.max)) }
     }
 
     // A system or a section entry. id is its override key; inherited is the
@@ -79,6 +81,7 @@ Column {
         property string unit: "px"
         required property real inherited
         property string follows: "base"
+        property real max: page.maxPx
         readonly property bool own: page.m.override[sr.key] !== undefined
         readonly property real px: sr.own ? page.m.override[sr.key] : sr.inherited
         objectName: "font:" + sr.key
@@ -116,6 +119,7 @@ Column {
                 anchors.verticalCenter: parent.verticalCenter
                 px: sr.px
                 unit: sr.unit
+                max: sr.max
                 enabled: sr.own
                 onChanged: px => page.fonts.setOverride(sr.key, px)
             }
@@ -147,7 +151,7 @@ Column {
 
     Heading { text: "Systems" }
     Repeater {
-        model: F.SYSTEMS.filter(s => s.id !== "groupbar")
+        model: F.SYSTEMS.filter(s => s.id !== "groupbar" && s.id !== "deckit")
         SizeRow {
             required property var modelData
             key: modelData.id
@@ -166,6 +170,26 @@ Column {
         inherited: page.m.base
     }
 
+    Heading { text: "deck-it" }
+    SizeRow {
+        key: "deckit"
+        title: "deck-it text"
+        detail: "The tablet page's rem. deck-it reads fonts.json itself; seen on the tablet within 5 s."
+        inherited: page.m.base
+    }
+    Repeater {
+        model: F.DECKIT_CLOCK
+        SizeRow {
+            required property var modelData
+            key: "deckit:" + modelData.id
+            title: modelData.label
+            detail: "On the dim cover, designed at " + modelData.ratio + "× deck-it's text."
+            follows: "deck-it"
+            max: 400
+            inherited: F.size(page.m, "deckit") * modelData.ratio
+        }
+    }
+
     // rofi and hyprlock: the section's size, which is its body text, then
     // each entry at its designed ratio to the body.
     Repeater {
@@ -209,4 +233,41 @@ Column {
             }
         }
     }
+
+    // Families no other config holds; the program reads fonts.json itself.
+    Heading { text: "Families" }
+    Small {
+        x: 8
+        width: parent.width - 16
+        text: "A family installed on this PC, as fc-list names it. Empty keeps the program's own font."
+    }
+    Repeater {
+        model: F.FAMILIES
+        Item {
+            id: fr
+            required property var modelData
+            objectName: "font:" + fr.modelData.id
+            width: page.width
+            height: 48
+            Column {
+                anchors { left: parent.left; leftMargin: 8; right: field.left; rightMargin: 12; verticalCenter: parent.verticalCenter }
+                Text {
+                    text: fr.modelData.label
+                    color: Theme.text
+                    font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 2 }
+                }
+                Small { width: parent.width; text: fr.modelData.where }
+            }
+            A.Field {
+                id: field
+                anchors { right: parent.right; rightMargin: 8; verticalCenter: parent.verticalCenter }
+                width: 240
+                value: page.m.family[fr.modelData.id] ?? ""
+                placeholder: "program's font"
+                // Every keystroke, not editingFinished: a click on Save takes no
+                // focus, so a name typed and saved would never reach the draft.
+                onValueChanged: if (value.trim() !== (page.m.family[fr.modelData.id] ?? "")) page.fonts.setFamily(fr.modelData.id, value)
+            }
+        }
+    }
 }