From 4ac55b0c2e7d80776fc7ac11cf001b33048ac8f7 Mon Sep 17 00:00:00 2001 From: zach Date: Sat, 7 Nov 2026 13:39:51 +0100 Subject: [PATCH] fix: font assignment in multiple components --- Components/MarqueeText.qml | 4 +- Greeter/Center.qml | 2 +- Greeter/Components/TextFieldBase.qml | 86 ++++++++++++++++++++++++++ Greeter/InputField.qml | 7 +-- Modules/Bar/Components/Clock.qml | 4 +- Modules/Bar/Components/WindowTitle.qml | 3 +- Modules/Bar/Popouts/AudioPopout.qml | 16 ++--- Modules/Bar/Popouts/UPowerPopout.qml | 3 +- Modules/Lock/InputField.qml | 2 +- Modules/Settings/Common/TimeInput.qml | 22 ++----- Modules/Sidebar/Chat/ChatList.qml | 8 +-- 11 files changed, 115 insertions(+), 42 deletions(-) create mode 100644 Greeter/Components/TextFieldBase.qml diff --git a/Components/MarqueeText.qml b/Components/MarqueeText.qml index aac13df..42c2a2f 100644 --- a/Components/MarqueeText.qml +++ b/Components/MarqueeText.qml @@ -118,7 +118,7 @@ Item { animate: root.animate animateProp: "opacity" color: root.color - font.pointSize: elideText.font.pointSize + font: elideText.font text: elideText.text } @@ -128,7 +128,7 @@ Item { animate: root.animate animateProp: "opacity" color: root.color - font.pointSize: elideText.font.pointSize + font: elideText.font text: t1.text x: t1.width + root.gap } diff --git a/Greeter/Center.qml b/Greeter/Center.qml index d7bb578..e4af077 100644 --- a/Greeter/Center.qml +++ b/Greeter/Center.qml @@ -227,7 +227,7 @@ SnapLayout { anchors.right: parent.right animateProp: "opacity" color: Colors.palette.m3onSurfaceVariant - font.family: Config.appearance.font.family.mono + font: Tokens.font.mono.medium horizontalAlignment: Qt.AlignHCenter lineHeight: 1.2 opacity: shouldBeVisible && !message.msg ? 1 : 0 diff --git a/Greeter/Components/TextFieldBase.qml b/Greeter/Components/TextFieldBase.qml new file mode 100644 index 0000000..94f2599 --- /dev/null +++ b/Greeter/Components/TextFieldBase.qml @@ -0,0 +1,86 @@ +import QtQuick +import QtQuick.Templates +import ZShell.Config +import qs.Services + +TextField { + id: root + + color: Colors.palette.m3onSurface + cursorVisible: !readOnly + font: Tokens.font.body.small + implicitHeight: contentHeight + topPadding + bottomPadding + implicitWidth: contentWidth + leftPadding + rightPadding + placeholderTextColor: Colors.palette.m3onSurfaceVariant // No anim cause placeholder is custom + renderType: TextField.QtRendering + selectedTextColor: color + selectionColor: Qt.alpha(Colors.palette.m3primary, 0.4) + verticalAlignment: TextInput.AlignVCenter + + Behavior on color { + CAnim {} + } + cursorDelegate: Item {} + Behavior on selectionColor { + CAnim {} + } + + CustomRect { + id: cursor + + property bool disableBlink + + color: Colors.palette.m3primary + implicitHeight: root.cursorRectangle.height + implicitWidth: 1.5 + radius: Tokens.rounding.largeIncreased + x: root.cursorRectangle.x + y: root.cursorRectangle.y + + Behavior on opacity { + Anim { + type: Anim.StandardSmall + } + } + Behavior on x { + Anim { + duration: Tokens.anim.durations.expressiveFastEffects + easing.bezierCurve: [0.2, 1, 0.21, 1, 1, 1] + } + } + + Connections { + function onCursorPositionChanged(): void { + if (root.activeFocus && root.cursorVisible) { + cursor.opacity = 1; + cursor.disableBlink = true; + enableBlink.restart(); + } + } + + target: root + } + + Timer { + id: enableBlink + + interval: 500 + + onTriggered: cursor.disableBlink = false + } + + Timer { + interval: 500 + repeat: true + running: root.activeFocus && root.cursorVisible && !cursor.disableBlink + triggeredOnStart: true + + onTriggered: parent.opacity = parent.opacity === 1 ? 0 : 1 + } + + Binding { + cursor.opacity: 0 + when: !root.activeFocus || !root.cursorVisible + } + } +} diff --git a/Greeter/InputField.qml b/Greeter/InputField.qml index 9bb5744..17948d4 100644 --- a/Greeter/InputField.qml +++ b/Greeter/InputField.qml @@ -40,7 +40,7 @@ Item { anchors.centerIn: parent animate: true color: root.greeter.launching ? Colors.palette.m3secondary : Colors.palette.m3outline - font: Tokens.font.mono.medium + font: Tokens.font.body.builders.medium.width(110).build() opacity: root.buffer ? 0 : 1 text: { if (root.greeter.launching) @@ -86,10 +86,9 @@ Item { anchors.centerIn: parent anchors.horizontalCenterOffset: implicitWidth > root.width ? -(implicitWidth - root.width) / 2 : 0 - implicitHeight: Tokens.font.body.medium + implicitHeight: Tokens.font.body.medium.pointSize implicitWidth: fullWidth interactive: false - opacity: root.greeter.echoResponse ? 0 : 1 orientation: Qt.Horizontal spacing: Tokens.spacing.small / 2 @@ -100,7 +99,7 @@ Item { implicitHeight: charList.implicitHeight implicitWidth: implicitHeight opacity: 0 - radius: Tokens.rounding.small / 2 + radius: Tokens.rounding.full scale: 0 Behavior on opacity { diff --git a/Modules/Bar/Components/Clock.qml b/Modules/Bar/Components/Clock.qml index 64d009b..ec7bda6 100644 --- a/Modules/Bar/Components/Clock.qml +++ b/Modules/Bar/Components/Clock.qml @@ -14,7 +14,7 @@ import qs.Services WidgetBase { id: root - readonly property font font: Tokens.font.clock.family(Config.appearance.font.family.clock).build() + readonly property font font: Tokens.font.clock.family(Config.appearance.font.family.clock).size(Tokens.font.body.small.pointSize).build() readonly property color contentColor: Colors.palette.m3onSurface readonly property string effectiveFormat: { let fmt = Config.general.dateFormat; @@ -71,8 +71,8 @@ WidgetBase { } SnapLayout { -orientation: Qt.Vertical id: verticalColumn + orientation: Qt.Vertical anchors.centerIn: parent spacing: Tokens.padding.extraSmall ?? 2 diff --git a/Modules/Bar/Components/WindowTitle.qml b/Modules/Bar/Components/WindowTitle.qml index 3c3a0a8..a62c65e 100644 --- a/Modules/Bar/Components/WindowTitle.qml +++ b/Modules/Bar/Components/WindowTitle.qml @@ -73,8 +73,7 @@ Item { anchors.topMargin: root.horizontal ? 0 : Tokens.spacing.small anchors.verticalCenter: root.horizontal ? parent.verticalCenter : undefined color: root.color - font.family: metrics.font.family - font.pointSize: metrics.font.pointSize + font: metrics.font height: root.horizontal ? implicitHeight : implicitWidth opacity: root.current === this ? 1 : 0 width: root.horizontal ? implicitWidth : implicitHeight diff --git a/Modules/Bar/Popouts/AudioPopout.qml b/Modules/Bar/Popouts/AudioPopout.qml index 5ec5f66..78b4e6e 100644 --- a/Modules/Bar/Popouts/AudioPopout.qml +++ b/Modules/Bar/Popouts/AudioPopout.qml @@ -19,6 +19,8 @@ Item { readonly property int panelRadius: Tokens.rounding.largeIncreased + Tokens.padding.smaller readonly property int rounding: panelRadius - Tokens.padding.smaller readonly property int topMargin: 0 + readonly property font valueFont: Tokens.font.body.builders.small.weight(Font.DemiBold).build() + required property var wrapper implicitHeight: vol.implicitHeight + Tokens.padding.smaller * 2 @@ -48,7 +50,7 @@ Item { } component VolumesTab: SnapLayout { -orientation: Qt.Vertical + orientation: Qt.Vertical spacing: 12 CustomRect { @@ -59,7 +61,7 @@ orientation: Qt.Vertical radius: root.rounding - vol.anchors.margins SnapLayout { -orientation: Qt.Vertical + orientation: Qt.Vertical anchors.bottomMargin: Tokens.padding.small anchors.fill: parent anchors.leftMargin: Tokens.padding.small @@ -79,7 +81,7 @@ orientation: Qt.Vertical CustomText { Layout.alignment: Qt.AlignVCenter | Qt.AlignRight color: Qt.alpha(Colors.palette.m3onSurface, 0.7) - font.bold: true + font: root.valueFont text: qsTr("%1").arg(Audio.muted ? qsTr("Muted") : `${Math.round(Audio.volume * 100)}%`) } } @@ -157,7 +159,7 @@ orientation: Qt.Vertical } SnapLayout { -orientation: Qt.Vertical + orientation: Qt.Vertical anchors.bottomMargin: Tokens.padding.small anchors.fill: parent anchors.leftMargin: Tokens.padding.small @@ -177,7 +179,7 @@ orientation: Qt.Vertical CustomText { Layout.alignment: Qt.AlignVCenter | Qt.AlignRight color: Qt.alpha(Colors.palette.m3onSurface, 0.7) - font.bold: true + font: root.valueFont text: qsTr("%1").arg(Audio.sourceMuted ? qsTr("Muted") : `${Math.round(Audio.sourceVolume * 100)}%`) } } @@ -281,7 +283,7 @@ orientation: Qt.Vertical } SnapLayout { -orientation: Qt.Vertical + orientation: Qt.Vertical anchors.bottomMargin: Tokens.padding.small anchors.fill: parent anchors.leftMargin: Tokens.padding.small @@ -302,7 +304,7 @@ orientation: Qt.Vertical CustomText { Layout.alignment: Qt.AlignVCenter | Qt.AlignRight color: Qt.alpha(Colors.palette.m3onSurface, 0.7) - font.bold: true + font: root.valueFont text: qsTr("%1").arg(appBox.modelData.audio.muted ? qsTr("Muted") : `${Math.round(appBox.modelData.audio.volume * 100)}%`) } } diff --git a/Modules/Bar/Popouts/UPowerPopout.qml b/Modules/Bar/Popouts/UPowerPopout.qml index 6fcbcbc..88c9ddb 100644 --- a/Modules/Bar/Popouts/UPowerPopout.qml +++ b/Modules/Bar/Popouts/UPowerPopout.qml @@ -112,7 +112,7 @@ Column { CustomText { anchors.verticalCenter: parent.verticalCenter color: Colors.palette.m3onError - font.family: Config.appearance.font.family.mono + font: Tokens.font.mono.small text: qsTr("Performance Degraded") } @@ -127,6 +127,7 @@ Column { CustomText { anchors.horizontalCenter: parent.horizontalCenter color: Colors.palette.m3onError + font: Tokens.font.label.small text: qsTr("Reason: %1").arg(PerformanceDegradationReason.toString(PowerProfiles.degradationReason)) } } diff --git a/Modules/Lock/InputField.qml b/Modules/Lock/InputField.qml index 49398a1..f30ba14 100644 --- a/Modules/Lock/InputField.qml +++ b/Modules/Lock/InputField.qml @@ -4,10 +4,10 @@ import Quickshell import QtQuick import QtQuick.Layouts import ZShell.Components +import ZShell.Config import qs.Modules import qs.Components import qs.Helpers -import ZShell.Config import qs.Services Item { diff --git a/Modules/Settings/Common/TimeInput.qml b/Modules/Settings/Common/TimeInput.qml index 3575b5f..55d46e2 100644 --- a/Modules/Settings/Common/TimeInput.qml +++ b/Modules/Settings/Common/TimeInput.qml @@ -7,8 +7,8 @@ import qs.Helpers import qs.Services SnapLayout { -orientation: Qt.Vertical id: root + orientation: Qt.Vertical required property int start required property int end @@ -67,10 +67,7 @@ orientation: Qt.Vertical anchors.verticalCenter: parent.verticalCenter clip: true color: focus ? Colors.palette.m3primaryContainer : Colors.palette.m3onSurface - font.family: "Roboto" - font.letterSpacing: -0.25 - font.pixelSize: 56 - font.weight: 400 + font: Tokens.font.body.builders.large.family("Roboto").letterSpacing(-0.25).pixelSize(56).weight(400).build() horizontalAlignment: TextInput.AlignHCenter text: setConfigText() verticalAlignment: TextInput.AlignVCenter @@ -179,10 +176,7 @@ orientation: Qt.Vertical anchors.verticalCenter: parent.verticalCenter clip: true color: focus ? Colors.palette.m3primaryContainer : Colors.palette.m3onSurface - font.family: "Roboto" - font.letterSpacing: -0.25 - font.pixelSize: 56 - font.weight: 400 + font: Tokens.font.body.builders.large.family("Roboto").letterSpacing(-0.25).pixelSize(56).weight(400).build() horizontalAlignment: TextInput.AlignHCenter text: setConfigText() verticalAlignment: TextInput.AlignVCenter @@ -290,10 +284,7 @@ orientation: Qt.Vertical anchors.verticalCenter: parent.verticalCenter clip: true color: focus ? Colors.palette.m3primaryContainer : Colors.palette.m3onSurface - font.family: "Roboto" - font.letterSpacing: -0.25 - font.pixelSize: 56 - font.weight: 400 + font: Tokens.font.body.builders.large.family("Roboto").letterSpacing(-0.25).pixelSize(56).weight(400).build() horizontalAlignment: TextInput.AlignHCenter text: setConfigText() verticalAlignment: TextInput.AlignVCenter @@ -402,10 +393,7 @@ orientation: Qt.Vertical anchors.verticalCenter: parent.verticalCenter clip: true color: focus ? Colors.palette.m3primaryContainer : Colors.palette.m3onSurface - font.family: "Roboto" - font.letterSpacing: -0.25 - font.pixelSize: 56 - font.weight: 400 + font: Tokens.font.body.builders.large.family("Roboto").letterSpacing(-0.25).pixelSize(56).weight(400).build() horizontalAlignment: TextInput.AlignHCenter text: setConfigText() verticalAlignment: TextInput.AlignVCenter diff --git a/Modules/Sidebar/Chat/ChatList.qml b/Modules/Sidebar/Chat/ChatList.qml index 2890fe2..a9b7dd3 100644 --- a/Modules/Sidebar/Chat/ChatList.qml +++ b/Modules/Sidebar/Chat/ChatList.qml @@ -36,9 +36,7 @@ Item { anchors.right: parent.right anchors.top: parent.top color: Colors.palette.m3outline - font.family: "CaskaydiaCove NF" - font.pointSize: 13 - font.weight: 500 + font: Tokens.font.mono.builders.small.weight(Font.DemiBold).build() text: qsTr("%1 Chat%2").arg(list.count).arg(list.count > 1 ? "s" : "") } @@ -134,7 +132,7 @@ Item { anchors.right: parent.right anchors.margins: Tokens.padding.small padding: 8 - font.pointSize: Math.round(18 * 1.2) + font: Tokens.font.icon.builders.medium.size(Math.round(18 * 1.2)).build() icon: root.slim ? "left_panel_open" : "add" isRound: ChatState.fabExpanded @@ -298,7 +296,7 @@ Item { CustomText { animate: true text: fabMenuItem.modelData.name - font.capitalization: Font.Capitalize + font: Tokens.font.body.builders.small.capitalization(Font.Capitalize).build color: Colors.palette.m3onPrimaryContainer Layout.preferredWidth: implicitWidth