zach/z-bar-qt
1
1
Fork 0
Code Issues 23 Pull Requests 3 Actions Packages Projects 1 Releases Wiki Activity

feat: fontbuilder to streamline font styling

Browse Source
This commit is contained in:
zach
2026-09-30 14:23:31 +02:00
parent 2c90339c77
commit f825e4d53b
115 changed files with 1687 additions and 916 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Components/BaseStyledSlider.qml
+14 -35
View File
@@ -80,49 +80,29 @@ Slider {
property bool moving property bool moving
function update(): void {
animate = !moving;
binding.when = moving;
font.pointSize = moving ? Tokens.font.size.small : Tokens.font.size.larger;
font.family = moving ? Config.appearance.font.family.sans : Config.appearance.font.family.material;
}
anchors.centerIn: parent anchors.centerIn: parent
anchors.verticalCenterOffset: 1
text: moving ? Math.round(root.value * 100) : root.icon
color: Colors.palette.m3inverseOnSurface color: Colors.palette.m3inverseOnSurface
text: root.icon font: moving ? Tokens.font.body.small : Tokens.font.icon.medium
onMovingChanged: anim.restart()
Binding {
id: binding
property: "text"
target: icon
value: Math.round(root.value * root.multiplier)
when: false
}
Behavior on moving {
SequentialAnimation { SequentialAnimation {
id: anim
Anim { Anim {
duration: Tokens.anim.durations.normal / 2
easing: Tokens.anim.standardAccel
property: "scale"
target: icon target: icon
to: 0 property: "scale"
to: 0.3
duration: Tokens.anim.durations.small / 2
easing: Tokens.anim.standardAccel
} }
PropertyAction {}
ScriptAction {
script: icon.update()
}
Anim { Anim {
target: icon
property: "scale"
to: 1
duration: Tokens.anim.durations.normal / 2 duration: Tokens.anim.durations.normal / 2
easing: Tokens.anim.standardDecel easing: Tokens.anim.standardDecel
property: "scale" }
target: icon
to: 1
} }
} }
} }
@@ -130,7 +110,7 @@ Slider {
} }
Behavior on value { Behavior on value {
Anim { Anim {
duration: Tokens.anim.durations.large type: Anim.StandardLarge
} }
} }
@@ -138,7 +118,6 @@ Slider {
onValueChanged: { onValueChanged: {
if (!initialized) { if (!initialized) {
initialized = true; initialized = true;
oldValue = value;
return; return;
} }
Components/ButtonBase.qml
+1 -5
View File
@@ -20,11 +20,7 @@ CustomRect {
property color disabledColor: Qt.alpha(Colors.palette.m3onSurface, 0.1) property color disabledColor: Qt.alpha(Colors.palette.m3onSurface, 0.1)
property color disabledOnColor: Qt.alpha(Colors.palette.m3onSurface, 0.38) property color disabledOnColor: Qt.alpha(Colors.palette.m3onSurface, 0.38)
property bool fillWidth property bool fillWidth
property font font: ({ property font font: Tokens.font.body.small
family: Config.appearance.font.family.sans,
pointSize: Tokens.font.size.larger,
bold: false
})
property real horizontalPadding: padding property real horizontalPadding: padding
readonly property alias hovered: stateLayer.containsMouse readonly property alias hovered: stateLayer.containsMouse
required implicitHeight required implicitHeight
Components/CustomRadioButton.qml
+3 -4
View File
@@ -6,7 +6,7 @@ import qs.Services
RadioButton { RadioButton {
id: root id: root
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
implicitHeight: Math.max(implicitIndicatorHeight, implicitContentHeight) implicitHeight: Math.max(implicitIndicatorHeight, implicitContentHeight)
implicitWidth: implicitIndicatorWidth + implicitContentWidth + contentItem.anchors.leftMargin implicitWidth: implicitIndicatorWidth + implicitContentWidth + contentItem.anchors.leftMargin
@@ -14,7 +14,7 @@ RadioButton {
anchors.left: outerCircle.right anchors.left: outerCircle.right
anchors.leftMargin: 10 anchors.leftMargin: 10
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
font.pointSize: root.font.pointSize font: root.font
text: root.text text: root.text
} }
indicator: Rectangle { indicator: Rectangle {
@@ -29,8 +29,7 @@ RadioButton {
radius: Tokens.rounding.full radius: Tokens.rounding.full
Behavior on border.color { Behavior on border.color {
CAnim { CAnim {}
}
} }
StateLayer { StateLayer {
Components/CustomSlider.qml
+9 -7
View File
@@ -100,15 +100,19 @@ Slider {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom
anchors.top: parent.top anchors.top: parent.top
color: root.insetColor color: root.insetColor
font.pixelSize: Tokens.font.size.smaller * 2 fontStyle: {
if (root.height < 96)
return Tokens.font.icon.pixelSize(24).build();
else
return Tokens.font.icon.pixelSize(32).build();
}
text: root.insetIcon text: root.insetIcon
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
visible: !root.wavy && root.insetIcon !== "" visible: !root.wavy && root.insetIcon !== ""
x: Tokens.spacing.extraSmall + dockT * (handle.x + Tokens.spacing.small) x: Tokens.spacing.extraSmall + dockT * (handle.x + Tokens.spacing.small)
Behavior on dockT { Behavior on dockT {
Anim { Anim {}
}
} }
} }
@@ -138,8 +142,7 @@ Slider {
startX: x startX: x
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
Anim on waveProgress { Anim on waveProgress {
duration: root.waveDuration duration: root.waveDuration
@@ -156,8 +159,7 @@ Slider {
Behavior on filledWidth { Behavior on filledWidth {
id: widthBehavior id: widthBehavior
Anim { Anim {}
}
} }
Component.onCompleted: { Component.onCompleted: {
Components/CustomText.qml
+3 -6
View File
@@ -14,15 +14,13 @@ Text {
property real animateTo: 1 property real animateTo: 1
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
font.family: Config.appearance.font.family.sans font: Tokens.font.body.small
font.pointSize: Tokens.font.size.normal
linkColor: Colors.palette.m3onPrimaryFixedVariant linkColor: Colors.palette.m3onPrimaryFixedVariant
renderType: Text.NativeRendering renderType: Text.NativeRendering
textFormat: Text.PlainText textFormat: Text.PlainText
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
Behavior on text { Behavior on text {
enabled: root.animate enabled: root.animate
@@ -34,8 +32,7 @@ Text {
type: Anim.FastEffects type: Anim.FastEffects
} }
PropertyAction { PropertyAction {}
}
TAnim { TAnim {
target: root target: root
Components/CustomTextField.qml
+4 -2
View File
@@ -29,7 +29,7 @@ TextFieldBase {
property string supportingText property string supportingText
property string trailingIcon property string trailingIcon
property int smallFontSize: Tokens.font.size.small property int smallFontSize: Tokens.font.label.small.pointSize
property int type: CustomTextField.Outlined property int type: CustomTextField.Outlined
property var validate // Regex or function property var validate // Regex or function
@@ -151,6 +151,7 @@ TextFieldBase {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
text: root.leadingIcon text: root.leadingIcon
fontStyle: Tokens.font.icon.builders.medium.scale(0.9).build()
} }
} }
@@ -165,6 +166,7 @@ TextFieldBase {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
text: root.trailingIcon text: root.trailingIcon
fontStyle: Tokens.font.icon.builders.medium.scale(0.9).build()
} }
} }
} }
@@ -179,7 +181,7 @@ TextFieldBase {
sourceComponent: CustomText { sourceComponent: CustomText {
color: root.isError ? Colors.palette.m3error : Colors.palette.m3onSurfaceVariant color: root.isError ? Colors.palette.m3error : Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: root.effectiveSupportingText text: root.effectiveSupportingText
} }
} }
Components/GeminiGlow.qml
Executable
+42
View File
@@ -0,0 +1,42 @@
import QtQuick
import Quickshell
ShaderEffect {
id: root
property Item target: parent
property real glowSize: 40
property real innerGlow: 0
property real lineWidth: 2
property real intensity: 1.0
property real speed: 1.0
property int period: 6000
property bool running: true
property color color1: "#4285F4"
property color color2: "#9B72CB"
property color color3: "#D96570"
property color color4: "#F2A54A"
readonly property size itemSize: Qt.size(width, height)
readonly property size rectSize: target ? Qt.size(target.width, target.height) : Qt.size(0, 0)
readonly property real radius: (target as Rectangle).radius ?? 0
property real phase: 0
anchors.fill: target
anchors.margins: -glowSize
z: -1
enabled: false
fragmentShader: Qt.resolvedUrl(`${Quickshell.shellDir}/assets/shaders/geminiglow.frag.qsb`)
FrameAnimation {
running: root.running && root.visible
onTriggered: {
const dt = frameTime * 1000;
root.phase = (root.phase + dt * root.speed / root.period) % 1.0;
}
}
}
Components/IconButton.qml
+2 -1
View File
@@ -8,6 +8,7 @@ ButtonBase {
property alias icon: label.text property alias icon: label.text
readonly property alias label: label readonly property alias label: label
font: Tokens.font.icon.medium
activeColor: type === IconButton.Filled ? Colors.palette.m3primary : Colors.palette.m3secondary activeColor: type === IconButton.Filled ? Colors.palette.m3primary : Colors.palette.m3secondary
activeOnColor: type === IconButton.Filled ? Colors.palette.m3onPrimary : type === IconButton.Tonal ? Colors.palette.m3onSecondary : Colors.palette.m3primary activeOnColor: type === IconButton.Filled ? Colors.palette.m3onPrimary : type === IconButton.Tonal ? Colors.palette.m3onSecondary : Colors.palette.m3primary
implicitHeight: { implicitHeight: {
@@ -36,7 +37,7 @@ ButtonBase {
anchors.verticalCenterOffset: 1 anchors.verticalCenterOffset: 1
color: root.onColor color: root.onColor
fill: !root.isToggle || root.internalChecked ? 1 : 0 fill: !root.isToggle || root.internalChecked ? 1 : 0
font.pointSize: root.font.pointSize fontStyle: root.font
Behavior on fill { Behavior on fill {
Anim { Anim {
Components/IconTextButton.qml
+1 -2
View File
@@ -46,10 +46,9 @@ ButtonBase {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
color: root.onColor color: root.onColor
fill: root.internalChecked ? 1 : 0 fill: root.internalChecked ? 1 : 0
font: { fontStyle: {
const f = Qt.font(root.font); const f = Qt.font(root.font);
f.pointSize = Math.round(root.font.pointSize * 1.2); f.pointSize = Math.round(root.font.pointSize * 1.2);
f.family = "Material Symbols Rounded";
return f; return f;
} }
Components/MaterialIcon.qml
+3 -17
View File
@@ -1,27 +1,13 @@
import QtQuick
import ZShell.Config import ZShell.Config
import qs.Services import qs.Services
CustomText { CustomText {
id: root id: root
readonly property list<int> allowed: [20, 24, 40, 48]
property real fill: 0 property real fill: 0
property int grade: Colors.light ? 0 : -25 property int grade: Colors.light ? 0 : -25
readonly property int opsz: clampOpsz(optical) property font fontStyle: Tokens.font.icon.small
property int optical: fontInfo.pixelSize
function clampOpsz(value): int { font: Tokens.font.icon.size(fontStyle.pointSize).weight(fontStyle.weight).vaxes(fontStyle.variableAxes).fill(fill.toFixed(1)).grade(grade).build()
return allowed.reduce((closest, current) => {
return Math.abs(current - value) < Math.abs(closest - value) ? current : closest;
});
}
font.family: "Material Symbols Rounded"
font.pointSize: Tokens.font.size.larger
font.variableAxes: ({
FILL: fill,
GRAD: grade,
opsz: opsz,
wght: fontInfo.weight
})
} }
Components/SearchBar.qml
+1 -1
View File
@@ -62,7 +62,7 @@ TextFieldBase {
anchors.leftMargin: Tokens.padding.large anchors.leftMargin: Tokens.padding.large
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.builders.medium.scale(0.9).build()
text: "search" text: "search"
} }
Components/TextFieldBase.qml
+4 -7
View File
@@ -8,7 +8,7 @@ TextField {
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
cursorVisible: !readOnly cursorVisible: !readOnly
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
implicitHeight: contentHeight + topPadding + bottomPadding implicitHeight: contentHeight + topPadding + bottomPadding
implicitWidth: contentWidth + leftPadding + rightPadding implicitWidth: contentWidth + leftPadding + rightPadding
placeholderTextColor: Colors.palette.m3onSurfaceVariant // No anim cause placeholder is custom placeholderTextColor: Colors.palette.m3onSurfaceVariant // No anim cause placeholder is custom
@@ -18,14 +18,11 @@ TextField {
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
}
cursorDelegate: Item {
} }
cursorDelegate: Item {}
Behavior on selectionColor { Behavior on selectionColor {
CAnim { CAnim {}
}
} }
CustomRect { CustomRect {
Components/Toast/ToastItem.qml
+3 -4
View File
@@ -36,8 +36,7 @@ CustomRect {
radius: Tokens.rounding.medium radius: Tokens.rounding.medium
Behavior on border.color { Behavior on border.color {
CAnim { CAnim {}
}
} }
Elevation { Elevation {
@@ -84,7 +83,7 @@ CustomRect {
return Colors.palette.m3onError; return Colors.palette.m3onError;
return Colors.palette.m3onSurfaceVariant; return Colors.palette.m3onSurfaceVariant;
} }
font.pointSize: Math.round(Tokens.font.size.large * 1.2) fontStyle: Tokens.font.icon.builders.large.scale(1.2).build()
text: root.modelData.icon text: root.modelData.icon
} }
} }
@@ -107,7 +106,7 @@ CustomRect {
return Colors.palette.m3onSurface; return Colors.palette.m3onSurface;
} }
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.normal font: Tokens.font.title.small
text: root.modelData.title text: root.modelData.title
} }
Helpers/Picker.qml
+1 -1
View File
@@ -42,7 +42,7 @@ Item {
readonly property real scaleRatio: Hypr.monitorFor(screen).scale readonly property real scaleRatio: Hypr.monitorFor(screen).scale
required property ShellScreen screen required property ShellScreen screen
property real sh: Math.abs(sy - ey) property real sh: Math.abs(sy - ey)
readonly property color shadowColor: Hypr.options.decoration.shadow.color readonly property color shadowColor: Hypr.options.decoration.shadow?.color ?? "black"
readonly property bool shadowEnabled: Hypr.options.decoration.shadow.enabled readonly property bool shadowEnabled: Hypr.options.decoration.shadow.enabled
readonly property var shadowOffset: Hypr.options.decoration.shadow.offset readonly property var shadowOffset: Hypr.options.decoration.shadow.offset
readonly property int shadowRange: Hypr.options.decoration.shadow.range readonly property int shadowRange: Hypr.options.decoration.shadow.range
Helpers/Picker/AnnotationToolbar.qml
+7 -7
View File
@@ -73,7 +73,7 @@ CustomRect {
required property var modelData required property var modelData
color: root.tool === modelData.id ? "#3584e4" : "transparent" color: root.tool === modelData.id ? "#3584e4" : "transparent"
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: tool.modelData.glyph icon: tool.modelData.glyph
inactiveColor: root.tool === modelData.id ? Colors.palette.m3primary : "transparent" inactiveColor: root.tool === modelData.id ? Colors.palette.m3primary : "transparent"
inactiveOnColor: root.tool === modelData.id ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface inactiveOnColor: root.tool === modelData.id ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
@@ -103,7 +103,7 @@ CustomRect {
required property color modelData required property color modelData
fillWidth: false fillWidth: false
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "" icon: ""
implicitHeight: buttonSize implicitHeight: buttonSize
implicitWidth: buttonSize implicitWidth: buttonSize
@@ -128,7 +128,7 @@ CustomRect {
spacing: Tokens.spacing.extraSmall spacing: Tokens.spacing.extraSmall
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "undo" icon: "undo"
inactiveColor: "transparent" inactiveColor: "transparent"
inactiveOnColor: Colors.palette.m3onSurface inactiveOnColor: Colors.palette.m3onSurface
@@ -140,7 +140,7 @@ CustomRect {
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "delete_history" icon: "delete_history"
inactiveColor: "transparent" inactiveColor: "transparent"
inactiveOnColor: Colors.palette.m3onSurface inactiveOnColor: Colors.palette.m3onSurface
@@ -152,7 +152,7 @@ CustomRect {
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "content_copy" icon: "content_copy"
inactiveColor: "transparent" inactiveColor: "transparent"
inactiveOnColor: Colors.palette.m3onSurface inactiveOnColor: Colors.palette.m3onSurface
@@ -164,7 +164,7 @@ CustomRect {
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "delete_forever" icon: "delete_forever"
inactiveColor: "transparent" inactiveColor: "transparent"
inactiveOnColor: Colors.palette.m3onSurface inactiveOnColor: Colors.palette.m3onSurface
@@ -176,7 +176,7 @@ CustomRect {
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "check" icon: "check"
inactiveColor: "transparent" inactiveColor: "transparent"
inactiveOnColor: Colors.palette.m3onSurface inactiveOnColor: Colors.palette.m3onSurface
Modules/Bar/Components/Clock.qml
+5 -4
View File
@@ -13,6 +13,7 @@ import qs.Services
WidgetBase { WidgetBase {
id: root id: root
readonly property font font: Tokens.font.clock.family(Config.appearance.font.family.clock).build()
readonly property color contentColor: screenState.dashboard ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface readonly property color contentColor: screenState.dashboard ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
readonly property string effectiveFormat: { readonly property string effectiveFormat: {
let fmt = Config.general.dateFormat; let fmt = Config.general.dateFormat;
@@ -57,7 +58,7 @@ WidgetBase {
anchors.centerIn: parent anchors.centerIn: parent
color: root.contentColor color: root.contentColor
font.family: Config.appearance.font.family.mono // qmllint disable incompatible-type font: root.font
height: implicitHeight height: implicitHeight
text: Time.dateStr text: Time.dateStr
visible: root.horizontal visible: root.horizontal
@@ -84,7 +85,7 @@ WidgetBase {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.contentColor color: root.contentColor
font.family: Config.appearance.font.family.mono // qmllint disable incompatible-type font: root.font
text: Qt.formatDateTime(Time.date, modelData) text: Qt.formatDateTime(Time.date, modelData)
Behavior on color { Behavior on color {
@@ -114,7 +115,7 @@ WidgetBase {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.contentColor color: root.contentColor
font.family: Config.appearance.font.family.mono // qmllint disable incompatible-type font: root.font
text: { text: {
if (modelData.includes("h")) if (modelData.includes("h"))
return Time.hourStr; return Time.hourStr;
@@ -135,7 +136,7 @@ WidgetBase {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.contentColor color: root.contentColor
font.family: Config.appearance.font.family.mono // qmllint disable incompatible-type font: root.font
text: Qt.formatDateTime(Time.date, "AP") text: Qt.formatDateTime(Time.date, "AP")
visible: Config.services.useTwelveHourClock && root.formatParts.timeTokens.length > 0 visible: Config.services.useTwelveHourClock && root.formatParts.timeTokens.length > 0
Modules/Bar/Components/Common/BatteryIcon.qml
+2 -4
View File
@@ -28,8 +28,7 @@ Row {
CustomText { CustomText {
color: Battery.getColors(root.percentage, root.devState).fg color: Battery.getColors(root.percentage, root.devState).fg
font.pointSize: Tokens.font.size.larger / 1.5 font: Tokens.font.body.builders.small.size(11).weight(Font.Bold).build()
font.weight: 800
height: track.height height: track.height
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: Math.round(root.percentage * 100) text: Math.round(root.percentage * 100)
@@ -60,8 +59,7 @@ Row {
clip: true clip: true
color: Battery.getColors(root.percentage, root.devState).bg color: Battery.getColors(root.percentage, root.devState).bg
font.pointSize: Tokens.font.size.larger / 1.5 font: Tokens.font.body.builders.small.size(11).weight(Font.Bold).build()
font.weight: 800
height: track.height height: track.height
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: Math.round(root.percentage * 100) text: Math.round(root.percentage * 100)
Modules/Bar/Components/HyprsunsetWidget.qml
+2 -3
View File
@@ -25,12 +25,11 @@ WidgetBase {
animate: true animate: true
color: root.tempEnabled ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface color: root.tempEnabled ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
fill: root.tempEnabled ? 1 : 0 fill: root.tempEnabled ? 1 : 0
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: root.tempEnabled ? "lightbulb" : "light_off" text: root.tempEnabled ? "lightbulb" : "light_off"
Behavior on fill { Behavior on fill {
Anim { Anim {}
}
} }
} }
} }
Modules/Bar/Components/MediaWidget.qml
+4 -8
View File
@@ -19,14 +19,12 @@ WidgetBase {
Behavior on implicitHeight { Behavior on implicitHeight {
enabled: !root.horizontal enabled: !root.horizontal
Anim { Anim {}
}
} }
Behavior on implicitWidth { Behavior on implicitWidth {
enabled: root.horizontal enabled: root.horizontal
Anim { Anim {}
}
} }
TextMetrics { TextMetrics {
@@ -47,15 +45,14 @@ WidgetBase {
columns: root.horizontal ? -1 : 1 columns: root.horizontal ? -1 : 1
Behavior on implicitWidth { Behavior on implicitWidth {
Anim { Anim {}
}
} }
MaterialIcon { MaterialIcon {
Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter
animate: true animate: true
color: Players.active?.isPlaying ? Colors.palette.m3primary : Colors.palette.m3onSurface color: Players.active?.isPlaying ? Colors.palette.m3primary : Colors.palette.m3onSurface
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: Players.active?.isPlaying ? "music_note" : "music_off" text: Players.active?.isPlaying ? "music_note" : "music_off"
} }
@@ -65,7 +62,6 @@ WidgetBase {
Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter
animate: true animate: true
color: Players.active?.isPlaying ? Colors.palette.m3primary : Colors.palette.m3onSurface color: Players.active?.isPlaying ? Colors.palette.m3primary : Colors.palette.m3onSurface
font.pointSize: Tokens.font.size.normal
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
implicitHeight: root.horizontal ? root.implicitHeight : root.textWidth implicitHeight: root.horizontal ? root.implicitHeight : root.textWidth
implicitWidth: root.horizontal ? root.textWidth : root.implicitWidth implicitWidth: root.horizontal ? root.textWidth : root.implicitWidth
Modules/Bar/Components/NotifBell.qml
+3 -5
View File
@@ -22,16 +22,14 @@ WidgetBase {
anchors.centerIn: parent anchors.centerIn: parent
color: root.screenState.sidebar ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface color: root.screenState.sidebar ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
fill: root.screenState.sidebar ? 1 : 0 fill: root.screenState.sidebar ? 1 : 0
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.size(16).build()
text: NotifServer.list.length ? "\uf4fe" : "\ue7f4" text: NotifServer.list.length ? "\uf4fe" : "\ue7f4"
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
Behavior on fill { Behavior on fill {
Anim { Anim {}
}
} }
} }
Modules/Bar/Components/Resource.qml
+2 -3
View File
@@ -27,8 +27,7 @@ GridLayout {
percentage: 0 percentage: 0
Behavior on animatedPercentage { Behavior on animatedPercentage {
Anim { Anim {}
}
} }
Component.onCompleted: animatedPercentage = percentage Component.onCompleted: animatedPercentage = percentage
@@ -44,7 +43,7 @@ GridLayout {
Layout.preferredWidth: 16 Layout.preferredWidth: 16
color: root.iconColor color: root.iconColor
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: root.icon text: root.icon
} }
Modules/Bar/Components/StatusIcons/AudioWidget.qml
+4 -7
View File
@@ -13,19 +13,16 @@ MaterialIcon {
animate: true animate: true
color: Audio.muted ? Colors.palette.m3error : Colors.palette.m3onSurface color: Audio.muted ? Colors.palette.m3error : Colors.palette.m3onSurface
fill: 1 fill: 1
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: Audio.muted ? "volume_off" : "volume_up" text: Audio.muted ? "volume_off" : "volume_up"
Behavior on Layout.maximumWidth { Behavior on Layout.maximumWidth {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
} }
Modules/Bar/Components/StatusIcons/MicWidget.qml
+4 -7
View File
@@ -13,19 +13,16 @@ MaterialIcon {
animate: true animate: true
color: (Audio.sourceMuted ?? false) ? Colors.palette.m3error : Colors.palette.m3onSurface color: (Audio.sourceMuted ?? false) ? Colors.palette.m3error : Colors.palette.m3onSurface
fill: 1 fill: 1
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: Audio.sourceMuted ? "mic_off" : "mic" text: Audio.sourceMuted ? "mic_off" : "mic"
Behavior on Layout.maximumWidth { Behavior on Layout.maximumWidth {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
} }
Modules/Bar/Components/StatusIcons/UPowerWidget.qml
+5 -9
View File
@@ -15,20 +15,16 @@ Item {
implicitWidth: currentItem?.implicitWidth ?? 0 implicitWidth: currentItem?.implicitWidth ?? 0
Behavior on Layout.preferredHeight { Behavior on Layout.preferredHeight {
Anim { Anim {}
}
} }
Behavior on Layout.preferredWidth { Behavior on Layout.preferredWidth {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
Component.onCompleted: Battery.startDaemon() Component.onCompleted: Battery.startDaemon()
@@ -67,7 +63,7 @@ Item {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
animate: true animate: true
fill: 1 fill: 1
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.small
text: { text: {
if (PowerProfiles.profile === PowerProfile.PowerSaver) if (PowerProfiles.profile === PowerProfile.PowerSaver)
return "energy_savings_leaf"; return "energy_savings_leaf";
Modules/Bar/Components/UpdatesWidget.qml
+1 -2
View File
@@ -27,14 +27,13 @@ WidgetBase {
MaterialIcon { MaterialIcon {
Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter
font.pointSize: root.horizontal ? Tokens.font.size.larger : Tokens.font.size.large fontStyle: Tokens.font.icon.small
text: "package_2" text: "package_2"
} }
CustomText { CustomText {
Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter Layout.alignment: root.horizontal ? Qt.AlignVCenter : Qt.AlignHCenter
color: root.textColor color: root.textColor
font.pointSize: Tokens.font.size.normal
text: root.countUpdates text: root.countUpdates
} }
} }
Modules/Bar/Components/WindowTitle.qml
+2 -4
View File
@@ -52,8 +52,7 @@ Item {
elide: Qt.ElideRight elide: Qt.ElideRight
elideWidth: root.maxSize - (root.horizontal ? root.current.anchors.leftMargin : 0) elideWidth: root.maxSize - (root.horizontal ? root.current.anchors.leftMargin : 0)
font.family: "Rubik" font: Tokens.font.body.small
font.pointSize: Tokens.font.size.normal
text: Hypr.activeToplevel?.title ?? qsTr("Desktop") text: Hypr.activeToplevel?.title ?? qsTr("Desktop")
onElideWidthChanged: root.current.text = elidedText onElideWidthChanged: root.current.text = elidedText
@@ -81,8 +80,7 @@ Item {
width: root.horizontal ? implicitWidth : implicitHeight width: root.horizontal ? implicitWidth : implicitHeight
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
transform: [ transform: [
Translate { Translate {
Modules/Bar/Popouts/UPowerPopout.qml
+2 -3
View File
@@ -181,8 +181,7 @@ Column {
} }
] ]
transitions: Transition { transitions: Transition {
AnchorAnim { AnchorAnim {}
}
} }
} }
@@ -246,7 +245,7 @@ Column {
anchors.centerIn: parent anchors.centerIn: parent
color: profiles.current === text ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface color: profiles.current === text ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
fill: profiles.current === text ? 1 : 0 fill: profiles.current === text ? 1 : 0
font.pointSize: Tokens.font.size.large * 2 fontStyle: Tokens.font.icon.extraLarge
grade: Colors.light ? 0 : (text === "balance" ? -25 : 0) grade: Colors.light ? 0 : (text === "balance" ? -25 : 0)
text: parent.icon text: parent.icon
Modules/Bar/Popouts/UpdatesPopout.qml
+6 -6
View File
@@ -39,7 +39,7 @@ CustomClippingRect {
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top anchors.top: parent.top
color: Colors.tPalette.m3onSurfaceVariant color: Colors.tPalette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.extraLarge * 3 fontStyle: Tokens.font.icon.builders.large.size(48).weight(Font.DemiBold).build()
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: "check" text: "check"
} }
@@ -89,7 +89,7 @@ CustomClippingRect {
anchors.rightMargin: Tokens.padding.small anchors.rightMargin: Tokens.padding.small
MaterialIcon { MaterialIcon {
font.pointSize: Tokens.font.size.large * 2 fontStyle: Tokens.font.icon.extraLarge
text: "package_2" text: "package_2"
} }
@@ -100,7 +100,7 @@ CustomClippingRect {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 25 Layout.preferredHeight: 25
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.large font: Tokens.font.title.medium
text: update.sections[0] text: update.sections[0]
} }
@@ -122,7 +122,7 @@ CustomClippingRect {
Layout.preferredWidth: 125 Layout.preferredWidth: 125
animate: true animate: true
color: Colors.palette.m3tertiary color: Colors.palette.m3tertiary
font.pointSize: Tokens.font.size.large font: Tokens.font.title.medium
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
marqueeEnabled: true marqueeEnabled: true
pauseMs: 4000 pauseMs: 4000
@@ -133,7 +133,7 @@ CustomClippingRect {
MaterialIcon { MaterialIcon {
Layout.fillHeight: true Layout.fillHeight: true
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.large
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: "arrow_right_alt" text: "arrow_right_alt"
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
@@ -146,7 +146,7 @@ CustomClippingRect {
Layout.preferredWidth: 120 Layout.preferredWidth: 120
animate: true animate: true
color: Colors.palette.m3primary color: Colors.palette.m3primary
font.pointSize: Tokens.font.size.large font: Tokens.font.title.medium
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
marqueeEnabled: true marqueeEnabled: true
pauseMs: 4000 pauseMs: 4000
Modules/Clipboard/Content.qml
+2 -4
View File
@@ -66,8 +66,7 @@ Item {
radius: 25 radius: 25
Behavior on implicitWidth { Behavior on implicitWidth {
Anim { Anim {}
}
} }
Column { Column {
@@ -104,7 +103,6 @@ Item {
anchors.right: parent.right anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small
text: lineRow.modelData.line text: lineRow.modelData.line
} }
} }
@@ -252,7 +250,7 @@ Item {
anchors.left: parent.left anchors.left: parent.left
anchors.margins: Tokens.padding.small anchors.margins: Tokens.padding.small
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: clipItem.isImage ? "image" : "text_fields" text: clipItem.isImage ? "image" : "text_fields"
} }
Modules/Dashboard/Dash/DateTime.qml
-51
View File
@@ -1,51 +0,0 @@
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Layouts
import qs.Components
import ZShell.Config
import qs.Helpers
import qs.Services
Item {
id: root
anchors.bottom: parent.bottom
anchors.top: parent.top
implicitWidth: 110
ColumnLayout {
anchors.left: parent.left
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
spacing: 0
CustomText {
Layout.alignment: Qt.AlignHCenter
Layout.bottomMargin: -(font.pointSize * 0.4)
color: Colors.palette.m3secondary
font.family: "Rubik"
font.pointSize: 18
font.weight: 600
text: Time.hourStr
}
CustomText {
Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3primary
font.family: "Rubik"
font.pointSize: 18 * 0.9
text: "•••"
}
CustomText {
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: -(font.pointSize * 0.4)
color: Colors.palette.m3secondary
font.family: "Rubik"
font.pointSize: 18
font.weight: 600
text: Time.minuteStr
}
}
}
Modules/Dashboard/Dash/User.qml
+2 -5
View File
@@ -23,8 +23,7 @@ Row {
MaterialIcon { MaterialIcon {
anchors.centerIn: parent anchors.centerIn: parent
fill: 1 fill: 1
font.pointSize: Math.floor(info.implicitHeight / 2) || 1 fontStyle: Tokens.font.icon.large
grade: 200
text: "person" text: "person"
} }
@@ -65,7 +64,6 @@ Row {
anchors.leftMargin: icon.anchors.leftMargin anchors.leftMargin: icon.anchors.leftMargin
anchors.verticalCenter: icon.verticalCenter anchors.verticalCenter: icon.verticalCenter
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: 13
text: `: ${SystemInfo.osPrettyName || SystemInfo.osName}` text: `: ${SystemInfo.osPrettyName || SystemInfo.osName}`
width: Config.dashboard.sizes.infoWidth width: Config.dashboard.sizes.infoWidth
} }
@@ -103,7 +101,7 @@ Row {
anchors.leftMargin: (Config.dashboard.sizes.infoIconSize - implicitWidth) / 2 anchors.leftMargin: (Config.dashboard.sizes.infoIconSize - implicitWidth) / 2
color: line.colour color: line.colour
fill: 1 fill: 1
font.pointSize: 13 fontStyle: Tokens.font.icon.small
text: line.icon text: line.icon
} }
@@ -114,7 +112,6 @@ Row {
anchors.leftMargin: icon.anchors.leftMargin anchors.leftMargin: icon.anchors.leftMargin
anchors.verticalCenter: icon.verticalCenter anchors.verticalCenter: icon.verticalCenter
elide: Text.ElideNone elide: Text.ElideNone
font.pointSize: 13
text: `: ${line.text}` text: `: ${line.text}`
width: Config.dashboard.sizes.infoWidth width: Config.dashboard.sizes.infoWidth
} }
Modules/Dashboard/Dash/Weather.qml
+2 -3
View File
@@ -19,7 +19,7 @@ Item {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
animate: true animate: true
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.pointSize: 54 fontStyle: Tokens.font.icon.extraLarge
text: Weather.icon text: Weather.icon
} }
@@ -35,8 +35,7 @@ Item {
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
animate: true animate: true
color: Colors.palette.m3primary color: Colors.palette.m3primary
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.body.large
font.weight: 500
text: Weather.temp text: Weather.temp
} }
Modules/Dashboard/Media.qml
+3 -3
View File
@@ -108,7 +108,7 @@ Item {
anchors.centerIn: parent anchors.centerIn: parent
text: "queue_music" text: "queue_music"
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
color: Colors.palette.m3onPrimaryContainer color: Colors.palette.m3onPrimaryContainer
} }
} }
@@ -116,13 +116,13 @@ Item {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: qsTr("Nothing playing") text: qsTr("Nothing playing")
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
} }
CustomText { CustomText {
text: qsTr("Play something for it to show up here!") text: qsTr("Play something for it to show up here!")
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
} }
} }
} }
Modules/Dashboard/Media/Details.qml
+9 -9
View File
@@ -38,7 +38,7 @@ ColumnLayout {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
text: Players.active?.trackTitle ?? "" text: Players.active?.trackTitle ?? ""
font.pointSize: Tokens.font.size.large font: Tokens.font.title.large
elide: Text.ElideRight elide: Text.ElideRight
animate: true animate: true
} }
@@ -47,7 +47,7 @@ ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
text: Players.active?.trackArtist || qsTr("Unknown artist") text: Players.active?.trackArtist || qsTr("Unknown artist")
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.title.medium
elide: Text.ElideRight elide: Text.ElideRight
animate: true animate: true
} }
@@ -56,7 +56,7 @@ ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
text: Players.active?.trackAlbum || qsTr("Unknown album") text: Players.active?.trackAlbum || qsTr("Unknown album")
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.pointSize: Tokens.font.size.normal font: Tokens.font.title.medium
elide: Text.ElideRight elide: Text.ElideRight
animate: true animate: true
} }
@@ -70,7 +70,7 @@ ColumnLayout {
id: timeMetrics id: timeMetrics
text: Players.active ? root.lengthStr(Math.max(Players.active.position, root.hasUnknownLength ? 0 : Players.active.length)).replace(/[1-9]/g, "0") : "00:00" text: Players.active ? root.lengthStr(Math.max(Players.active.position, root.hasUnknownLength ? 0 : Players.active.length)).replace(/[1-9]/g, "0") : "00:00"
font.pointSize: Tokens.font.size.normal font: Tokens.font.label.medium
} }
CustomText { CustomText {
@@ -128,7 +128,7 @@ ColumnLayout {
isRound: true isRound: true
shapeMorph: true shapeMorph: true
checked: Players.active?.shuffle ?? false checked: Players.active?.shuffle ?? false
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.builders.medium.weight(Font.Medium).build()
enabled: Players.active?.shuffleSupported enabled: Players.active?.shuffleSupported
onClicked: Players.active.shuffle = !Players.active?.shuffle onClicked: Players.active.shuffle = !Players.active?.shuffle
implicitWidth: Math.round(implicitHeight * 0.9) implicitWidth: Math.round(implicitHeight * 0.9)
@@ -141,7 +141,7 @@ ColumnLayout {
icon: "skip_previous" icon: "skip_previous"
isRound: true isRound: true
shapeMorph: true shapeMorph: true
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.icon.large
enabled: Players.active?.canGoPrevious enabled: Players.active?.canGoPrevious
onClicked: Players.active?.previous() onClicked: Players.active?.previous()
} }
@@ -154,7 +154,7 @@ ColumnLayout {
shapeMorph: true shapeMorph: true
fillWidth: true fillWidth: true
checked: Players.active?.isPlaying ?? false checked: Players.active?.isPlaying ?? false
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.icon.large
enabled: Players.active?.canTogglePlaying enabled: Players.active?.canTogglePlaying
onClicked: Players.active?.togglePlaying() onClicked: Players.active?.togglePlaying()
} }
@@ -166,7 +166,7 @@ ColumnLayout {
icon: "skip_next" icon: "skip_next"
isRound: true isRound: true
shapeMorph: true shapeMorph: true
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.icon.large
enabled: Players.active?.canGoNext enabled: Players.active?.canGoNext
onClicked: Players.active?.next() onClicked: Players.active?.next()
} }
@@ -177,7 +177,7 @@ ColumnLayout {
isRound: true isRound: true
shapeMorph: true shapeMorph: true
checked: Players.active?.loopState === MprisLoopState.Track || Players.active?.loopState === MprisLoopState.Playlist checked: Players.active?.loopState === MprisLoopState.Track || Players.active?.loopState === MprisLoopState.Playlist
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.builders.medium.weight(Font.Medium).build()
enabled: Players.active?.loopSupported enabled: Players.active?.loopSupported
onClicked: { onClicked: {
const state = Players.active.loopState; const state = Players.active.loopState;
Modules/Dashboard/Media/LyricList.qml
+4 -4
View File
@@ -179,7 +179,7 @@ Item {
CustomText { CustomText {
text: qsTr("Loading lyrics...") text: qsTr("Loading lyrics...")
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.normal
} }
} }
@@ -204,14 +204,14 @@ Item {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: "sentiment_sad" text: "sentiment_sad"
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
color: Colors.palette.m3outline color: Colors.palette.m3outline
} }
CustomText { CustomText {
text: qsTr("No lyrics found") text: qsTr("No lyrics found")
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
} }
} }
} }
@@ -258,7 +258,7 @@ Item {
text: modelData || ". . ." text: modelData || ". . ."
color: ListView.isCurrentItem ? Colors.palette.m3primary : mouse.containsMouse ? Colors.palette.m3onSurface : Colors.palette.m3outline color: ListView.isCurrentItem ? Colors.palette.m3primary : mouse.containsMouse ? Colors.palette.m3onSurface : Colors.palette.m3outline
font.pointSize: Tokens.font.size.medium font: Tokens.font.body.medium
wrapMode: Text.WrapAtWordBoundaryOrAnywhere wrapMode: Text.WrapAtWordBoundaryOrAnywhere
layer.enabled: effectScale > 0 layer.enabled: effectScale > 0
Modules/Dashboard/Media/LyricsAndSelector.qml
+2 -2
View File
@@ -23,13 +23,13 @@ Item {
MaterialIcon { MaterialIcon {
Layout.topMargin: Math.round(fontInfo.pointSize * 0.12) Layout.topMargin: Math.round(fontInfo.pointSize * 0.12)
text: "lyrics" text: "lyrics"
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
} }
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
text: qsTr("Lyrics") text: qsTr("Lyrics")
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
} }
LyricsInfo {} LyricsInfo {}
Modules/Dashboard/Media/LyricsInfo.qml
+2 -2
View File
@@ -184,7 +184,7 @@ Item {
text: Lyrics.loading ? qsTr("Loading...") : qsTr("No lyrics found") text: Lyrics.loading ? qsTr("Loading...") : qsTr("No lyrics found")
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
animate: true animate: true
} }
} }
@@ -206,7 +206,7 @@ Item {
anchors.centerIn: parent anchors.centerIn: parent
text: "more_vert" text: "more_vert"
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
} }
} }
} }
Modules/Dashboard/Tabs.qml
+1 -1
View File
@@ -162,7 +162,7 @@ Item {
text: tab.iconName text: tab.iconName
color: tab.current ? Colors.palette.m3primary : Colors.palette.m3onSurfaceVariant color: tab.current ? Colors.palette.m3primary : Colors.palette.m3onSurfaceVariant
fill: tab.current ? 1 : 0 fill: tab.current ? 1 : 0
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
Behavior on fill { Behavior on fill {
Anim { Anim {
Modules/Dashboard/Weather/Graphs.qml
+2 -2
View File
@@ -48,7 +48,7 @@ RowLayout {
MaterialIcon { MaterialIcon {
text: "device_thermostat" text: "device_thermostat"
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
} }
@@ -99,7 +99,7 @@ RowLayout {
MaterialIcon { MaterialIcon {
text: "water_drop" text: "water_drop"
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
color: Colors.palette.m3tertiary color: Colors.palette.m3tertiary
} }
Modules/Dashboard/WeatherTab.qml
+15 -14
View File
@@ -31,13 +31,13 @@ Item {
CustomText { CustomText {
text: Weather.city || qsTr("Loading...") text: Weather.city || qsTr("Loading...")
font.pointSize: Tokens.font.size.large font: Tokens.font.body.builders.large.size(24).weight(Font.DemiBold).build()
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
} }
CustomText { CustomText {
text: new Date().toLocaleDateString(Qt.locale("en_US"), "dddd, MMMM d") text: new Date().toLocaleDateString(Qt.locale("en_US"), "dddd, MMMM d")
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
} }
} }
@@ -114,7 +114,7 @@ Item {
Layout.leftMargin: Tokens.padding.medium Layout.leftMargin: Tokens.padding.medium
visible: forecastRepeater.count > 0 visible: forecastRepeater.count > 0
text: qsTr("7-day forecast") text: qsTr("7-day forecast")
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.builders.medium.weight(Font.DemiBold).build()
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
} }
@@ -148,7 +148,7 @@ Item {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: forecastItem.index === 0 ? qsTr("Today", "forecast column") : new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale("en_US"), "ddd") text: forecastItem.index === 0 ? qsTr("Today", "forecast column") : new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale("en_US"), "ddd")
font.pointSize: Tokens.font.size.small font: Tokens.font.body.builders.medium.weight(Font.DemiBold).build()
color: Colors.palette.m3primary color: Colors.palette.m3primary
} }
@@ -156,7 +156,7 @@ Item {
Layout.topMargin: -Tokens.spacing.extraSmall Layout.topMargin: -Tokens.spacing.extraSmall
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale("en_US"), "MMM d") text: new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale("en_US"), "MMM d")
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
opacity: 0.7 opacity: 0.7
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
} }
@@ -164,7 +164,7 @@ Item {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: forecastItem.modelData.icon text: forecastItem.modelData.icon
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
} }
@@ -175,7 +175,7 @@ Item {
const max = Weather.formatTemp(forecastItem.modelData.maxTempC, true); const max = Weather.formatTemp(forecastItem.modelData.maxTempC, true);
return qsTr("%1 / %2", "min/max temperature").arg(min).arg(max); return qsTr("%1 / %2", "min/max temperature").arg(min).arg(max);
} }
font.pointSize: Tokens.font.size.small font: Tokens.font.body.builders.small.weight(Font.DemiBold).build()
color: Colors.palette.m3tertiary color: Colors.palette.m3tertiary
} }
} }
@@ -204,7 +204,7 @@ Item {
MaterialIcon { MaterialIcon {
text: detailRoot.icon text: detailRoot.icon
color: detailRoot.colour color: detailRoot.colour
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
} }
@@ -214,20 +214,20 @@ Item {
CustomText { CustomText {
text: detailRoot.label text: detailRoot.label
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
opacity: 0.7 opacity: 0.7
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
} }
CustomText { CustomText {
text: detailRoot.value text: detailRoot.value
font.pointSize: Tokens.font.size.small font: Tokens.font.body.builders.small.weight(Font.DemiBold).build()
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
} }
} }
} }
} }
component WeatherStat: Row { component WeatherStat: RowLayout {
id: weatherStat id: weatherStat
property string icon property string icon
@@ -239,19 +239,20 @@ Item {
MaterialIcon { MaterialIcon {
text: weatherStat.icon text: weatherStat.icon
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
color: weatherStat.colour color: weatherStat.colour
} }
Column { Column {
Layout.alignment: Qt.AlignVCenter
CustomText { CustomText {
text: weatherStat.label text: weatherStat.label
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
} }
CustomText { CustomText {
text: weatherStat.value text: weatherStat.value
font.pointSize: Tokens.font.size.small font: Tokens.font.body.builders.small.weight(Font.DemiBold).build()
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
} }
} }
Modules/DesktopIcons/BackgroundContextMenu.qml
+36 -16
View File
@@ -38,7 +38,9 @@ Item {
implicitWidth: menuLayout.implicitWidth + padding * 2 implicitWidth: menuLayout.implicitWidth + padding * 2
implicitHeight: menuLayout.implicitHeight + padding * 2 implicitHeight: menuLayout.implicitHeight + padding * 2
Behavior on opacity { Anim {} } Behavior on opacity {
Anim {}
}
opacity: root.visible ? 1 : 0 opacity: root.visible ? 1 : 0
ColumnLayout { ColumnLayout {
@@ -57,16 +59,22 @@ Item {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: Tokens.padding.small anchors.leftMargin: Tokens.padding.small
MaterialIcon { text: "terminal"; font.pointSize: 20 } MaterialIcon {
CustomText { text: "Open terminal"; Layout.fillWidth: true } text: "terminal"
fontStyle: Tokens.font.icon.medium
}
CustomText {
text: "Open terminal"
Layout.fillWidth: true
}
} }
StateLayer { StateLayer {
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
Quickshell.execDetached([Config.general.apps.terminal, "--working-directory", FileUtils.trimFileProtocol(Paths.desktop)]) Quickshell.execDetached([Config.general.apps.terminal, "--working-directory", FileUtils.trimFileProtocol(Paths.desktop)]);
root.close() root.close();
} }
} }
} }
@@ -90,8 +98,14 @@ Item {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: Tokens.padding.small anchors.leftMargin: Tokens.padding.small
MaterialIcon { text: "settings"; font.pointSize: 20 } MaterialIcon {
CustomText { text: "ZShell settings"; Layout.fillWidth: true } text: "settings"
fontStyle: Tokens.font.icon.medium
}
CustomText {
text: "ZShell settings"
Layout.fillWidth: true
}
} }
StateLayer { StateLayer {
@@ -100,7 +114,7 @@ Item {
onClicked: { onClicked: {
const state = ShellState.forActive(); const state = ShellState.forActive();
state.settings = true; state.settings = true;
root.close() root.close();
} }
} }
} }
@@ -124,16 +138,22 @@ Item {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: Tokens.padding.small anchors.leftMargin: Tokens.padding.small
MaterialIcon { text: "logout"; font.pointSize: 20 } MaterialIcon {
CustomText { text: "Logout"; Layout.fillWidth: true } text: "logout"
fontStyle: Tokens.font.icon.medium
}
CustomText {
text: "Logout"
Layout.fillWidth: true
}
} }
StateLayer { StateLayer {
anchors.fill: parent anchors.fill: parent
onClicked: { onClicked: {
Hyprland.dispatch("global quickshell:sessionOpen") Hyprland.dispatch("global quickshell:sessionOpen");
root.close() root.close();
} }
} }
} }
@@ -174,12 +194,12 @@ Item {
} }
function openAt(mouseX, mouseY, parentW, parentH) { function openAt(mouseX, mouseY, parentW, parentH) {
menuX = Math.floor(Math.min(mouseX, parentW - popupBackground.implicitWidth)) menuX = Math.floor(Math.min(mouseX, parentW - popupBackground.implicitWidth));
menuY = Math.floor(Math.min(mouseY, parentH - popupBackground.implicitHeight)) menuY = Math.floor(Math.min(mouseY, parentH - popupBackground.implicitHeight));
visible = true visible = true;
} }
function close() { function close() {
visible = false visible = false;
} }
} }
Modules/DesktopIcons/DesktopIconContextMenu.qml
+6 -7
View File
@@ -54,8 +54,7 @@ Item {
y: contextMenu.menuY y: contextMenu.menuY
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
ColumnLayout { ColumnLayout {
@@ -77,7 +76,7 @@ Item {
spacing: 8 spacing: 8
MaterialIcon { MaterialIcon {
font.pointSize: 20 fontStyle: Tokens.font.icon.medium
text: "open_in_new" text: "open_in_new"
} }
@@ -120,7 +119,7 @@ Item {
spacing: 8 spacing: 8
MaterialIcon { MaterialIcon {
font.pointSize: 20 fontStyle: Tokens.font.icon.medium
text: contextMenu.targetIsDir ? "terminal" : "apps" text: contextMenu.targetIsDir ? "terminal" : "apps"
} }
@@ -165,7 +164,7 @@ Item {
spacing: 8 spacing: 8
MaterialIcon { MaterialIcon {
font.pointSize: 20 fontStyle: Tokens.font.icon.medium
text: "content_copy" text: "content_copy"
} }
@@ -199,7 +198,7 @@ Item {
spacing: 8 spacing: 8
MaterialIcon { MaterialIcon {
font.pointSize: 20 fontStyle: Tokens.font.icon.medium
text: "edit" text: "edit"
} }
@@ -241,7 +240,7 @@ Item {
MaterialIcon { MaterialIcon {
color: deleteButton.hovered ? Colors.palette.m3onError : Colors.palette.m3error color: deleteButton.hovered ? Colors.palette.m3onError : Colors.palette.m3error
font.pointSize: 20 fontStyle: Tokens.font.icon.medium
text: "delete" text: "delete"
} }
Modules/Drawing/Content.qml
+1 -3
View File
@@ -145,7 +145,6 @@ Item {
IconTextButton { IconTextButton {
fillWidth: true fillWidth: true
font.pointSize: Tokens.font.size.normal
icon: "close" icon: "close"
inactiveColor: Colors.palette.m3error inactiveColor: Colors.palette.m3error
inactiveOnColor: Colors.palette.m3onError inactiveOnColor: Colors.palette.m3onError
@@ -158,7 +157,6 @@ Item {
IconTextButton { IconTextButton {
fillWidth: true fillWidth: true
font.pointSize: Tokens.font.size.normal
icon: "ink_eraser" icon: "ink_eraser"
inactiveColor: Colors.layer(Colors.palette.m3surfaceContainerHighest, 2) inactiveColor: Colors.layer(Colors.palette.m3surfaceContainerHighest, 2)
inactiveOnColor: Colors.palette.m3onSurfaceVariant inactiveOnColor: Colors.palette.m3onSurfaceVariant
@@ -193,7 +191,7 @@ Item {
required property ButtonRow row required property ButtonRow row
fillWidth: false fillWidth: false
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
icon: "" icon: ""
implicitHeight: buttonSize implicitHeight: buttonSize
implicitWidth: buttonSize implicitWidth: buttonSize
Modules/Drawing/Wrapper.qml
+3 -5
View File
@@ -74,11 +74,10 @@ Item {
opacity: root.expanded ? 0 : 1 opacity: root.expanded ? 0 : 1
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.medium
text: "arrow_forward_ios" text: "arrow_forward_ios"
} }
} }
@@ -93,8 +92,7 @@ Item {
opacity: root.expanded ? 1 : 0 opacity: root.expanded ? 1 : 0
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
sourceComponent: Content { sourceComponent: Content {
drawing: root.drawing drawing: root.drawing
Modules/Launcher/ContentList.qml
+6 -10
View File
@@ -53,8 +53,7 @@ Item {
to: 0 to: 0
} }
PropertyAction { PropertyAction {}
}
Anim { Anim {
duration: Tokens.anim.durations.small duration: Tokens.anim.durations.small
@@ -130,18 +129,16 @@ Item {
spacing: Tokens.spacing.medium spacing: Tokens.spacing.medium
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
MaterialIcon { MaterialIcon {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
text: root.state === "wallpapers" ? "wallpaper_slideshow" : "manage_search" text: root.state === "wallpapers" ? "wallpaper_slideshow" : "manage_search"
} }
@@ -150,14 +147,13 @@ Item {
CustomText { CustomText {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.larger font: Tokens.font.body.builders.large.weight(Font.Medium).build()
font.weight: 500
text: root.state === "wallpapers" ? qsTr("No wallpapers found") : qsTr("No results") text: root.state === "wallpapers" ? qsTr("No wallpapers found") : qsTr("No results")
} }
CustomText { CustomText {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: root.state === "wallpapers" && Wallpapers.list.length === 0 ? qsTr("Try putting some wallpapers in %1").arg(Paths.shortenHome(Paths.wallsdir)) : qsTr("Try searching for something else") text: root.state === "wallpapers" && Wallpapers.list.length === 0 ? qsTr("Try putting some wallpapers in %1").arg(Paths.shortenHome(Paths.wallsdir)) : qsTr("Try searching for something else")
} }
} }
Modules/Launcher/Items/ActionItem.qml
+2 -3
View File
@@ -33,7 +33,7 @@ Item {
id: icon id: icon
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.large
text: root.modelData?.icon ?? "" text: root.modelData?.icon ?? ""
} }
@@ -47,7 +47,6 @@ Item {
CustomText { CustomText {
id: name id: name
font.pointSize: Tokens.font.size.normal
text: root.modelData?.name ?? "" text: root.modelData?.name ?? ""
} }
@@ -57,7 +56,7 @@ Item {
anchors.top: name.bottom anchors.top: name.bottom
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.modelData?.desc ?? "" text: root.modelData?.desc ?? ""
width: root.width - icon.width - Tokens.rounding.medium * 2 width: root.width - icon.width - Tokens.rounding.medium * 2
} }
Modules/Launcher/Items/AppItem.qml
+1 -2
View File
@@ -51,7 +51,6 @@ Item {
CustomText { CustomText {
id: name id: name
font.pointSize: Tokens.font.size.normal
text: root.modelData?.name ?? "" text: root.modelData?.name ?? ""
} }
@@ -61,7 +60,7 @@ Item {
anchors.top: name.bottom anchors.top: name.bottom
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: (root.modelData?.comment || root.modelData?.genericName || root.modelData?.name) ?? "" text: (root.modelData?.comment || root.modelData?.genericName || root.modelData?.name) ?? ""
width: root.width - icon.width - Tokens.rounding.medium - Tokens.padding.medium * 2 width: root.width - icon.width - Tokens.rounding.medium - Tokens.padding.medium * 2
} }
Modules/Launcher/Items/CalcItem.qml
+3 -3
View File
@@ -40,7 +40,7 @@ Item {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.large
text: "function" text: "function"
} }
@@ -92,7 +92,7 @@ Item {
anchors.rightMargin: Tokens.spacing.small anchors.rightMargin: Tokens.spacing.small
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onTertiary color: Colors.palette.m3onTertiary
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
opacity: stateLayer.containsMouse ? 1 : 0 opacity: stateLayer.containsMouse ? 1 : 0
text: qsTr("Open in calculator") text: qsTr("Open in calculator")
@@ -109,7 +109,7 @@ Item {
anchors.rightMargin: Tokens.padding.small anchors.rightMargin: Tokens.padding.small
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onTertiary color: Colors.palette.m3onTertiary
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
text: "open_in_new" text: "open_in_new"
} }
} }
Modules/Launcher/Items/FilesItem.qml
+2 -2
View File
@@ -120,7 +120,7 @@ Item {
CustomText { CustomText {
id: name id: name
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: root.modelData?.name ?? "" text: root.modelData?.name ?? ""
elide: Text.ElideRight elide: Text.ElideRight
width: root.width - icon.width - openLocation.implicitWidth - openLocation.anchors.rightMargin - Tokens.spacing.medium - Tokens.rounding.medium * 2 width: root.width - icon.width - openLocation.implicitWidth - openLocation.anchors.rightMargin - Tokens.spacing.medium - Tokens.rounding.medium * 2
@@ -132,7 +132,7 @@ Item {
anchors.top: name.bottom anchors.top: name.bottom
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.modelData?.path ?? "" text: root.modelData?.path ?? ""
width: root.width - icon.width - openLocation.implicitWidth - openLocation.anchors.rightMargin - Tokens.spacing.medium - Tokens.rounding.medium * 2 width: root.width - icon.width - openLocation.implicitWidth - openLocation.anchors.rightMargin - Tokens.spacing.medium - Tokens.rounding.medium * 2
} }
Modules/Launcher/Items/VariantItem.qml
+3 -4
View File
@@ -32,7 +32,7 @@ Item {
id: icon id: icon
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.large
text: root.modelData?.icon ?? "" text: root.modelData?.icon ?? ""
} }
@@ -44,7 +44,6 @@ Item {
width: parent.width - icon.width - anchors.leftMargin - (current.active ? current.width + Tokens.spacing.medium : 0) width: parent.width - icon.width - anchors.leftMargin - (current.active ? current.width + Tokens.spacing.medium : 0)
CustomText { CustomText {
font.pointSize: Tokens.font.size.normal
text: root.modelData?.name ?? "" text: root.modelData?.name ?? ""
} }
@@ -53,7 +52,7 @@ Item {
anchors.right: parent.right anchors.right: parent.right
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.modelData?.description ?? "" text: root.modelData?.description ?? ""
} }
} }
@@ -67,7 +66,7 @@ Item {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: "check" text: "check"
} }
} }
Modules/Launcher/Items/WallpaperTile.qml
+1 -2
View File
@@ -32,8 +32,7 @@ Item {
MaterialIcon { MaterialIcon {
anchors.centerIn: parent anchors.centerIn: parent
color: Colors.tPalette.m3outline color: Colors.tPalette.m3outline
font.pointSize: Tokens.font.size.extraLarge * 2 fontStyle: Tokens.font.icon.builders.extraLarge.scale(2).weight(Font.DemiBold).build()
font.weight: 600
text: "image" text: "image"
} }
Modules/Lock/Center.qml
+12 -25
View File
@@ -28,27 +28,21 @@ ColumnLayout {
CustomText { CustomText {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.bold: true font: Tokens.font.headline.builders.large.scale(3 * root.centerScale).weight(Font.Bold).width(30).build()
font.family: Config.appearance.font.family.clock
font.pointSize: Math.floor(Tokens.font.size.extraLarge * 3 * root.centerScale)
text: Time.hourStr text: Time.hourStr
} }
CustomText { CustomText {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
color: Colors.palette.m3primary color: Colors.palette.m3primary
font.bold: true font: Tokens.font.headline.builders.large.scale(3 * root.centerScale).weight(Font.Bold).width(30).build()
font.family: Config.appearance.font.family.clock
font.pointSize: Math.floor(Tokens.font.size.extraLarge * 3 * root.centerScale)
text: ":" text: ":"
} }
CustomText { CustomText {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.bold: true font: Tokens.font.headline.builders.large.scale(3 * root.centerScale).weight(Font.Bold).width(30).build()
font.family: Config.appearance.font.family.clock
font.pointSize: Math.floor(Tokens.font.size.extraLarge * 3 * root.centerScale)
text: Time.minuteStr text: Time.minuteStr
} }
} }
@@ -57,9 +51,7 @@ ColumnLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.topMargin: -Tokens.padding.large * 2 Layout.topMargin: -Tokens.padding.large * 2
color: Colors.palette.m3tertiary color: Colors.palette.m3tertiary
font.bold: true font: Tokens.font.title.builders.medium.weight(Font.DemiBold).build()
font.family: Config.appearance.font.family.mono
font.pointSize: Math.floor(Tokens.font.size.extraLarge * root.centerScale)
text: Time.format("dddd, d MMMM yyyy") text: Time.format("dddd, d MMMM yyyy")
} }
@@ -74,7 +66,7 @@ ColumnLayout {
MaterialIcon { MaterialIcon {
anchors.centerIn: parent anchors.centerIn: parent
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Math.floor(root.centerWidth / 4) fontStyle: Tokens.font.icon.size(root.centerWidth / 4).build()
text: "person" text: "person"
} }
@@ -144,8 +136,7 @@ ColumnLayout {
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
} }
@@ -159,6 +150,7 @@ ColumnLayout {
id: inputField id: inputField
pam: root.lock.pam pam: root.lock.pam
centerScale: root.centerScale
} }
CustomRect { CustomRect {
@@ -180,7 +172,6 @@ ColumnLayout {
anchors.centerIn: parent anchors.centerIn: parent
color: root.lock.pam.buffer ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface color: root.lock.pam.buffer ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
font.weight: 500
text: "arrow_forward" text: "arrow_forward"
} }
} }
@@ -193,8 +184,7 @@ ColumnLayout {
implicitHeight: Math.max(message.implicitHeight, stateMessage.implicitHeight) implicitHeight: Math.max(message.implicitHeight, stateMessage.implicitHeight)
Behavior on implicitHeight { Behavior on implicitHeight {
Anim { Anim {}
}
} }
CustomText { CustomText {
@@ -226,7 +216,7 @@ ColumnLayout {
anchors.right: parent.right anchors.right: parent.right
animateProp: "opacity" animateProp: "opacity"
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.family: Config.appearance.font.family.mono font: Tokens.font.body.small
horizontalAlignment: Qt.AlignHCenter horizontalAlignment: Qt.AlignHCenter
lineHeight: 1.2 lineHeight: 1.2
opacity: shouldBeVisible && !message.msg ? 1 : 0 opacity: shouldBeVisible && !message.msg ? 1 : 0
@@ -234,12 +224,10 @@ ColumnLayout {
wrapMode: Text.WrapAtWordBoundaryOrAnywhere wrapMode: Text.WrapAtWordBoundaryOrAnywhere
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
onMsgChanged: { onMsgChanged: {
@@ -295,8 +283,7 @@ ColumnLayout {
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
color: Colors.palette.m3error color: Colors.palette.m3error
font.family: Config.appearance.font.family.mono font: Tokens.font.body.small
font.pointSize: Tokens.font.size.small
horizontalAlignment: Qt.AlignHCenter horizontalAlignment: Qt.AlignHCenter
opacity: 0 opacity: 0
scale: 0.7 scale: 0.7
Modules/Lock/InputField.qml
+6 -9
View File
@@ -14,6 +14,7 @@ Item {
property string buffer property string buffer
required property Pam pam required property Pam pam
required property real centerScale
readonly property alias placeholder: placeholder readonly property alias placeholder: placeholder
Layout.fillHeight: true Layout.fillHeight: true
@@ -41,8 +42,7 @@ Item {
anchors.centerIn: parent anchors.centerIn: parent
animate: true animate: true
color: root.pam.passwd.active ? Colors.palette.m3secondary : Colors.palette.m3outline color: root.pam.passwd.active ? Colors.palette.m3secondary : Colors.palette.m3outline
font.family: Config.appearance.font.family.mono font: Tokens.font.body.builders.medium.scale(root.centerScale).width(110).build()
font.pointSize: Tokens.font.size.normal
opacity: root.buffer ? 0 : 1 opacity: root.buffer ? 0 : 1
text: { text: {
if (root.pam.passwd.active) if (root.pam.passwd.active)
@@ -53,8 +53,7 @@ Item {
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
} }
@@ -84,12 +83,11 @@ Item {
implicitHeight: charList.implicitHeight implicitHeight: charList.implicitHeight
implicitWidth: implicitHeight implicitWidth: implicitHeight
opacity: 0 opacity: 0
radius: Tokens.rounding.small / 2 radius: Tokens.rounding.full
scale: 0 scale: 0
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {
@@ -137,8 +135,7 @@ Item {
Behavior on implicitWidth { Behavior on implicitWidth {
id: imWidthBehavior id: imWidthBehavior
Anim { Anim {}
}
} }
model: ScriptModel { model: ScriptModel {
values: root.buffer.split("") values: root.buffer.split("")
Modules/Lock/LockSurface.qml
+1 -2
View File
@@ -236,8 +236,7 @@ WlSessionLockSurface {
id: lockIcon id: lockIcon
anchors.centerIn: parent anchors.centerIn: parent
font.bold: true fontStyle: Tokens.font.icon.builders.extraLarge.scale(4).weight(Font.Bold).build()
font.pointSize: Tokens.font.size.extraLarge * 4
text: "lock" text: "lock"
} }
Modules/Lock/Media.qml
+1 -2
View File
@@ -57,7 +57,7 @@ CustomClippingRect {
animate: true animate: true
color: Colors.palette.m3primary color: Colors.palette.m3primary
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.normal font: Tokens.font.title.large
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: (Players.active?.trackTitle ?? qsTr("Nothing playing")) || qsTr("Unknown track") text: (Players.active?.trackTitle ?? qsTr("Nothing playing")) || qsTr("Unknown track")
} }
@@ -67,7 +67,6 @@ CustomClippingRect {
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: (Players.active?.trackArtist ?? qsTr("Try playing some music!")) || qsTr("Unknown artist") text: (Players.active?.trackArtist ?? qsTr("Try playing some music!")) || qsTr("Unknown artist")
} }
Modules/Lock/NotifDock.qml
+2 -5
View File
@@ -66,9 +66,7 @@ ColumnLayout {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3outlineVariant color: Colors.palette.m3outlineVariant
font.family: Config.appearance.font.family.mono font: Tokens.font.headline.builders.small.width(90).build()
font.pointSize: Tokens.font.size.large
font.weight: 500
text: qsTr("No Notifications") text: qsTr("No Notifications")
} }
} }
@@ -94,8 +92,7 @@ ColumnLayout {
to: 1 to: 1
} }
} }
delegate: NotifGroup { delegate: NotifGroup {}
}
displaced: Transition { displaced: Transition {
Anim { Anim {
properties: "opacity,scale" properties: "opacity,scale"
Modules/Lock/NotifGroup.qml
+8 -12
View File
@@ -80,7 +80,7 @@ CustomRect {
MaterialIcon { MaterialIcon {
color: root.urgency === "critical" ? Colors.palette.m3onError : root.urgency === "low" ? Colors.palette.m3onSurface : Colors.palette.m3onSecondaryContainer color: root.urgency === "critical" ? Colors.palette.m3onError : root.urgency === "low" ? Colors.palette.m3onSurface : Colors.palette.m3onSecondaryContainer
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: Icons.getNotifIcon(root.notifs[0]?.summary, root.urgency) text: Icons.getNotifIcon(root.notifs[0]?.summary, root.urgency)
} }
} }
@@ -133,14 +133,14 @@ CustomRect {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.modelData text: root.modelData
} }
CustomText { CustomText {
animate: true animate: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.notifs[0]?.timeStr ?? "" text: root.notifs[0]?.timeStr ?? ""
} }
@@ -153,12 +153,10 @@ CustomRect {
radius: Tokens.rounding.full radius: Tokens.rounding.full
Behavior on Layout.preferredWidth { Behavior on Layout.preferredWidth {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
StateLayer { StateLayer {
@@ -181,7 +179,7 @@ CustomRect {
Layout.leftMargin: Tokens.padding.extraSmall / 2 Layout.leftMargin: Tokens.padding.extraSmall / 2
animate: true animate: true
color: root.urgency === "critical" ? Colors.palette.m3onError : Colors.palette.m3onSurface color: root.urgency === "critical" ? Colors.palette.m3onError : Colors.palette.m3onSurface
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: root.notifs.length text: root.notifs.length
} }
@@ -261,8 +259,7 @@ CustomRect {
opacity: root.expanded ? 1 : 0 opacity: root.expanded ? 1 : 0
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
sourceComponent: ColumnLayout { sourceComponent: ColumnLayout {
Repeater { Repeater {
@@ -270,8 +267,7 @@ CustomRect {
values: root.notifs.slice(Config.notifs.groupPreviewNum) values: root.notifs.slice(Config.notifs.groupPreviewNum)
} }
NotifLine { NotifLine {}
}
} }
} }
} }
Modules/Lock/Resources.qml
+2 -3
View File
@@ -70,14 +70,13 @@ CustomRect {
implicitSize: width implicitSize: width
Behavior on clampedVal { Behavior on clampedVal {
Anim { Anim {}
}
} }
MaterialIcon { MaterialIcon {
anchors.centerIn: parent anchors.centerIn: parent
color: res.fgColor color: res.fgColor
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
text: res.icon text: res.icon
} }
} }
Modules/Lock/Weather/BriefInfo.qml
+4 -4
View File
@@ -16,7 +16,7 @@ ColumnLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large font: Tokens.font.title.large
text: Weather.description text: Weather.description
} }
@@ -29,7 +29,7 @@ ColumnLayout {
animate: true animate: true
color: Colors.palette.m3primary color: Colors.palette.m3primary
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: Weather.temp text: Weather.temp
} }
@@ -44,7 +44,7 @@ ColumnLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: qsTr("Feels like %1").arg(Weather.temp) text: qsTr("Feels like %1").arg(Weather.temp)
visible: root.rootHeight > 550 visible: root.rootHeight > 550
} }
@@ -53,7 +53,7 @@ ColumnLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.normal
text: { text: {
const today = Weather.forecast[0]; const today = Weather.forecast[0];
return qsTr("High %1 • Low %2").arg(Weather.formatTemp(today?.maxTempC)).arg(Weather.formatTemp(today?.minTempC)); return qsTr("High %1 • Low %2").arg(Weather.formatTemp(today?.maxTempC)).arg(Weather.formatTemp(today?.minTempC));
Modules/Lock/Weather/Forecast.qml
+6 -7
View File
@@ -24,14 +24,14 @@ CustomRect {
MaterialIcon { MaterialIcon {
Layout.topMargin: Math.round(fontInfo.pointSize * 0.12) Layout.topMargin: Math.round(fontInfo.pointSize * 0.12)
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
text: "schedule" text: "schedule"
} }
CustomText { CustomText {
id: title id: title
font.pointSize: Tokens.font.size.normal font: Tokens.font.title.medium
text: qsTr("Hourly forecast") text: qsTr("Hourly forecast")
} }
} }
@@ -65,8 +65,7 @@ CustomRect {
shape: MaterialShape.Cookie4Sided shape: MaterialShape.Cookie4Sided
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
CustomText { CustomText {
@@ -74,7 +73,7 @@ CustomRect {
anchors.centerIn: parent anchors.centerIn: parent
color: hour.index === Weather.currentHourIndex ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface color: hour.index === Weather.currentHourIndex ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: Weather.formatTemp(hour.cond.tempC).slice(0, -1) // Remove C/F text: Weather.formatTemp(hour.cond.tempC).slice(0, -1) // Remove C/F
} }
} }
@@ -82,7 +81,7 @@ CustomRect {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
text: hour.cond.icon text: hour.cond.icon
} }
@@ -96,7 +95,7 @@ CustomRect {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.topMargin: Tokens.spacing.extraSmall Layout.topMargin: Tokens.spacing.extraSmall
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: hour.index === 0 ? qsTr("Now") : Qt.formatDateTime(new Date(hour.cond.timestamp.replace("T", " ")), Config.services.useTwelveHourClock ? "ha" : "hh:00") text: hour.index === 0 ? qsTr("Now") : Qt.formatDateTime(new Date(hour.cond.timestamp.replace("T", " ")), Config.services.useTwelveHourClock ? "ha" : "hh:00")
} }
} }
Modules/Notifications/Notification.qml
+15 -16
View File
@@ -94,8 +94,7 @@ CustomRect {
implicitHeight: root.nonAnimHeight implicitHeight: root.nonAnimHeight
Behavior on implicitHeight { Behavior on implicitHeight {
Anim { Anim {}
}
} }
Loader { Loader {
@@ -171,6 +170,7 @@ CustomRect {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
color: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onError : root.modelData.urgency === NotificationUrgency.Low ? Colors.palette.m3onSurface : Colors.palette.m3onSecondaryContainer color: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onError : root.modelData.urgency === NotificationUrgency.Low ? Colors.palette.m3onSurface : Colors.palette.m3onSecondaryContainer
text: Icons.getNotifIcon(root.modelData.summary, root.modelData.urgency) text: Icons.getNotifIcon(root.modelData.summary, root.modelData.urgency)
fontStyle: Tokens.font.icon.medium
} }
} }
} }
@@ -222,6 +222,7 @@ CustomRect {
maximumLineCount: 1 maximumLineCount: 1
opacity: root.expanded ? 1 : 0 opacity: root.expanded ? 1 : 0
text: appNameMetrics.elidedText text: appNameMetrics.elidedText
font: Tokens.font.label.medium
Behavior on opacity { Behavior on opacity {
Anim { Anim {
@@ -246,14 +247,12 @@ CustomRect {
anchors.leftMargin: Tokens.spacing.small anchors.leftMargin: Tokens.spacing.small
anchors.top: parent.top anchors.top: parent.top
animate: true animate: true
font.pointSize: Tokens.font.size.small
height: implicitHeight height: implicitHeight
maximumLineCount: 1 maximumLineCount: 1
text: summaryMetrics.elidedText text: summaryMetrics.elidedText
Behavior on height { Behavior on height {
Anim { Anim {}
}
} }
states: State { states: State {
name: "expanded" name: "expanded"
@@ -281,8 +280,7 @@ CustomRect {
property: "topMargin" property: "topMargin"
} }
AnchorAnim { AnchorAnim {}
}
} }
} }
@@ -303,6 +301,7 @@ CustomRect {
anchors.top: parent.top anchors.top: parent.top
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
text: "•" text: "•"
font: Tokens.font.body.small
states: State { states: State {
name: "expanded" name: "expanded"
@@ -314,8 +313,7 @@ CustomRect {
} }
} }
transitions: Transition { transitions: Transition {
AnchorAnim { AnchorAnim {}
}
} }
} }
@@ -327,7 +325,7 @@ CustomRect {
anchors.top: parent.top anchors.top: parent.top
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
text: root.modelData.timeStr text: root.modelData.timeStr
} }
@@ -355,14 +353,13 @@ CustomRect {
anchors.verticalCenterOffset: root.expanded ? -1 : 1 anchors.verticalCenterOffset: root.expanded ? -1 : 1
rotation: root.expanded ? 180 : 0 rotation: root.expanded ? 180 : 0
text: "expand_more" text: "expand_more"
fontStyle: Tokens.font.icon.medium
Behavior on anchors.verticalCenterOffset { Behavior on anchors.verticalCenterOffset {
Anim { Anim {}
}
} }
Behavior on rotation { Behavior on rotation {
Anim { Anim {}
}
} }
} }
} }
@@ -376,7 +373,7 @@ CustomRect {
anchors.top: summary.bottom anchors.top: summary.bottom
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
opacity: root.expanded ? 0 : 1 opacity: root.expanded ? 0 : 1
text: bodyPreviewMetrics.elidedText text: bodyPreviewMetrics.elidedText
textFormat: Text.MarkdownText textFormat: Text.MarkdownText
@@ -407,6 +404,7 @@ CustomRect {
animate: true animate: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
height: text ? implicitHeight : 0 height: text ? implicitHeight : 0
font: Tokens.font.body.medium
opacity: root.expanded ? 1 : 0 opacity: root.expanded ? 1 : 0
text: root.modelData.body text: root.modelData.body
textFormat: Text.MarkdownText textFormat: Text.MarkdownText
@@ -447,6 +445,7 @@ CustomRect {
enabled: root.expanded enabled: root.expanded
fillWidth: root.modelData.actions.length === 0 fillWidth: root.modelData.actions.length === 0
icon: "close" icon: "close"
font: Tokens.font.icon.builders.small.size(14).build()
inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2) inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2)
inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant
isRound: true isRound: true
@@ -464,7 +463,6 @@ CustomRect {
enabled: root.expanded enabled: root.expanded
fillWidth: true fillWidth: true
font.pointSize: Tokens.font.size.small
implicitWidth: label.implicitWidth implicitWidth: label.implicitWidth
inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2) inactiveColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3secondary : Colors.layer(Colors.palette.m3surfaceContainerHighest, 2)
inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant inactiveOnColor: root.modelData.urgency === NotificationUrgency.Critical ? Colors.palette.m3onSecondary : Colors.palette.m3onSurfaceVariant
@@ -493,6 +491,7 @@ CustomRect {
label.animate: true label.animate: true
padding: Tokens.padding.extraSmall padding: Tokens.padding.extraSmall
shapeMorph: true shapeMorph: true
font: Tokens.font.icon.builders.small.size(14).build()
onClicked: { onClicked: {
Quickshell.clipboardText = root.modelData.body; Quickshell.clipboardText = root.modelData.body;
Modules/Notifications/Sidebar/NotifDock.qml
+10 -22
View File
@@ -37,19 +37,15 @@ Item {
anchors.leftMargin: root.notifCount > 0 ? 0 : -width - titleText.anchors.leftMargin anchors.leftMargin: root.notifCount > 0 ? 0 : -width - titleText.anchors.leftMargin
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.family: "CaskaydiaCove NF" font: Tokens.font.label.large
font.pointSize: 13
font.weight: 500
opacity: root.notifCount > 0 ? 1 : 0 opacity: root.notifCount > 0 ? 1 : 0
text: root.notifCount text: root.notifCount
Behavior on anchors.leftMargin { Behavior on anchors.leftMargin {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
} }
@@ -62,9 +58,7 @@ Item {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.family: "CaskaydiaCove NF" font: Tokens.font.label.large
font.pointSize: 13
font.weight: 500
text: root.notifCount > 0 ? qsTr("notification%1").arg(root.notifCount === 1 ? "" : "s") : qsTr("Notifications") text: root.notifCount > 0 ? qsTr("notification%1").arg(root.notifCount === 1 ? "" : "s") : qsTr("Notifications")
} }
} }
@@ -86,8 +80,7 @@ Item {
opacity: root.notifCount > 0 ? 0 : 1 opacity: root.notifCount > 0 ? 0 : 1
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
sourceComponent: ColumnLayout { sourceComponent: ColumnLayout {
spacing: 20 spacing: 20
@@ -95,9 +88,7 @@ Item {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3outlineVariant color: Colors.palette.m3outlineVariant
font.family: "CaskaydiaCove NF" font: Tokens.font.headline.builders.small.width(90).build()
font.pointSize: 18
font.weight: 500
text: qsTr("No Notifications") text: qsTr("No Notifications")
} }
} }
@@ -160,20 +151,17 @@ Item {
scale: root.notifCount > 0 ? 1 : 0.5 scale: root.notifCount > 0 ? 1 : 0.5
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
sourceComponent: IconButton { sourceComponent: IconButton {
id: clearBtn id: clearBtn
font.pointSize: Math.round(18 * 1.2) font: Tokens.font.icon.large
icon: "clear_all" icon: "clear_all"
padding: 8 isRound: true
radius: Tokens.rounding.full
onClicked: clearTimer.start() onClicked: clearTimer.start()
Modules/Notifications/Sidebar/Utils/Cards/Record.qml
+12 -14
View File
@@ -13,7 +13,6 @@ CustomRect {
required property ScreenState screenState required property ScreenState screenState
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.tPalette.m3surfaceContainer color: Colors.tPalette.m3surfaceContainer
implicitHeight: layout.implicitHeight + layout.anchors.margins * 2 implicitHeight: layout.implicitHeight + layout.anchors.margins * 2
@@ -46,7 +45,7 @@ CustomRect {
anchors.horizontalCenterOffset: -0.5 anchors.horizontalCenterOffset: -0.5
anchors.verticalCenterOffset: 1.5 anchors.verticalCenterOffset: 1.5
color: Recorder.running ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer color: Recorder.running ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: "screen_record" text: "screen_record"
} }
} }
@@ -58,7 +57,7 @@ CustomRect {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: qsTr("Screen Recorder") text: qsTr("Screen Recorder")
} }
@@ -66,7 +65,7 @@ CustomRect {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: Recorder.paused ? qsTr("Recording paused") : Recorder.running ? qsTr("Recording running") : qsTr("Recording off") text: Recorder.paused ? qsTr("Recording paused") : Recorder.running ? qsTr("Recording running") : qsTr("Recording off")
} }
} }
@@ -126,8 +125,7 @@ CustomRect {
enabled: false enabled: false
Anim { Anim {}
}
} }
Behavior on running { Behavior on running {
SequentialAnimation { SequentialAnimation {
@@ -155,8 +153,7 @@ CustomRect {
value: true value: true
} }
PropertyAction { PropertyAction {}
}
PropertyAction { PropertyAction {
property: "enabled" property: "enabled"
@@ -207,8 +204,7 @@ CustomRect {
radius: Tokens.rounding.full radius: Tokens.rounding.full
Behavior on implicitWidth { Behavior on implicitWidth {
Anim { Anim {}
}
} }
SequentialAnimation on opacity { SequentialAnimation on opacity {
alwaysRunToEnd: true alwaysRunToEnd: true
@@ -236,13 +232,13 @@ CustomRect {
anchors.centerIn: parent anchors.centerIn: parent
animate: true animate: true
color: Recorder.paused ? Colors.palette.m3onTertiary : Colors.palette.m3onError color: Recorder.paused ? Colors.palette.m3onTertiary : Colors.palette.m3onError
font.family: Config.appearance.font.family.mono font: Tokens.font.mono.small
text: Recorder.paused ? "PAUSED" : "REC" text: Recorder.paused ? "PAUSED" : "REC"
} }
} }
CustomText { CustomText {
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: { text: {
const elapsed = Recorder.elapsed; const elapsed = Recorder.elapsed;
@@ -266,8 +262,9 @@ CustomRect {
IconButton { IconButton {
checked: Recorder.paused checked: Recorder.paused
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: Recorder.paused ? "play_arrow" : "pause" icon: Recorder.paused ? "play_arrow" : "pause"
isRound: true
isToggle: true isToggle: true
label.animate: true label.animate: true
type: IconButton.Tonal type: IconButton.Tonal
@@ -279,8 +276,9 @@ CustomRect {
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "stop" icon: "stop"
isRound: true
inactiveColor: Colors.palette.m3error inactiveColor: Colors.palette.m3error
inactiveOnColor: Colors.palette.m3onError inactiveOnColor: Colors.palette.m3onError
Modules/Notifications/Sidebar/Utils/Cards/RecordingList.qml
+3 -3
View File
@@ -29,14 +29,14 @@ ColumnLayout {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: "list" text: "list"
} }
CustomText { CustomText {
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
Layout.fillWidth: true Layout.fillWidth: true
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: qsTr("Recordings") text: qsTr("Recordings")
} }
@@ -177,7 +177,7 @@ ColumnLayout {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.preferredHeight: root.screenState.recordingListExpanded ? implicitHeight : 0 Layout.preferredHeight: root.screenState.recordingListExpanded ? implicitHeight : 0
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
opacity: root.screenState.recordingListExpanded ? 1 : 0 opacity: root.screenState.recordingListExpanded ? 1 : 0
scale: root.screenState.recordingListExpanded ? 1 : 0 scale: root.screenState.recordingListExpanded ? 1 : 0
text: "scan_delete" text: "scan_delete"
Modules/Notifications/Sidebar/Utils/Cards/Toggles.qml
+1 -1
View File
@@ -53,7 +53,7 @@ CustomRect {
spacing: Tokens.spacing.medium spacing: Tokens.spacing.medium
CustomText { CustomText {
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: qsTr("Quick Toggles") text: qsTr("Quick Toggles")
} }
Modules/Notifications/Sidebar/Utils/IdleInhibit.qml
+8 -12
View File
@@ -15,8 +15,7 @@ CustomRect {
radius: Tokens.rounding.small radius: Tokens.rounding.small
Behavior on implicitHeight { Behavior on implicitHeight {
Anim { Anim {}
}
} }
RowLayout { RowLayout {
@@ -39,7 +38,7 @@ CustomRect {
anchors.centerIn: parent anchors.centerIn: parent
color: IdleInhibitor.enabled ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer color: IdleInhibitor.enabled ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer
font.pointSize: 18 fontStyle: Tokens.font.icon.large
text: "coffee" text: "coffee"
} }
} }
@@ -51,7 +50,7 @@ CustomRect {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: 13 font: Tokens.font.body.medium
text: qsTr("Keep Awake") text: qsTr("Keep Awake")
} }
@@ -59,7 +58,7 @@ CustomRect {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: 11 font: Tokens.font.body.small
text: IdleInhibitor.enabled ? qsTr("Preventing sleep mode") : qsTr("Normal power management") text: IdleInhibitor.enabled ? qsTr("Preventing sleep mode") : qsTr("Normal power management")
} }
} }
@@ -83,16 +82,13 @@ CustomRect {
scale: IdleInhibitor.enabled ? 1 : 0.5 scale: IdleInhibitor.enabled ? 1 : 0.5
Behavior on anchors.bottomMargin { Behavior on anchors.bottomMargin {
Anim { Anim {}
}
} }
Behavior on opacity { Behavior on opacity {
Anim { Anim {}
}
} }
Behavior on scale { Behavior on scale {
Anim { Anim {}
}
} }
sourceComponent: CustomRect { sourceComponent: CustomRect {
color: Colors.palette.m3primary color: Colors.palette.m3primary
@@ -105,7 +101,7 @@ CustomRect {
anchors.centerIn: parent anchors.centerIn: parent
color: Colors.palette.m3onPrimary color: Colors.palette.m3onPrimary
font.pointSize: Math.round(11 * 0.9) font: Tokens.font.body.builders.small.size(Math.round(Tokens.font.body.small.pointSize * 0.9)).build()
text: qsTr("Active since %1").arg(Qt.formatTime(IdleInhibitor.enabledSince, Config.services.useTwelveHourClock ? "hh:mm a" : "hh:mm")) text: qsTr("Active since %1").arg(Qt.formatTime(IdleInhibitor.enabledSince, Config.services.useTwelveHourClock ? "hh:mm a" : "hh:mm"))
} }
} }
Modules/Polkit/Polkit.qml
+5 -7
View File
@@ -112,7 +112,7 @@ Scope {
MaterialIcon { MaterialIcon {
anchors.fill: parent anchors.fill: parent
font.pointSize: 64 fontStyle: Tokens.font.icon.size(64).build()
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: "security" text: "security"
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
@@ -129,8 +129,7 @@ Scope {
CustomText { CustomText {
Layout.alignment: Qt.AlignLeft Layout.alignment: Qt.AlignLeft
Layout.preferredWidth: Math.min(600, contentWidth) Layout.preferredWidth: Math.min(600, contentWidth)
font.bold: true font: Tokens.font.title.builders.medium.weight(Font.Bold).build()
font.pointSize: 16
text: polkitAgent.flow?.message ?? "" text: polkitAgent.flow?.message ?? ""
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
@@ -139,8 +138,7 @@ Scope {
Layout.alignment: Qt.AlignLeft Layout.alignment: Qt.AlignLeft
Layout.preferredWidth: Math.min(600, contentWidth) Layout.preferredWidth: Math.min(600, contentWidth)
color: Colors.tPalette.m3onSurfaceVariant color: Colors.tPalette.m3onSurfaceVariant
font.bold: true font: Tokens.font.title.builders.small.weight(Font.Bold).build()
font.pointSize: 12
text: polkitAgent.flow?.supplementaryMessage || "No Additional Information" text: polkitAgent.flow?.supplementaryMessage || "No Additional Information"
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
@@ -155,6 +153,7 @@ Scope {
placeholderText: polkitAgent.flow?.failed ? " Incorrect Password" : " Input Password" placeholderText: polkitAgent.flow?.failed ? " Incorrect Password" : " Input Password"
placeholderTextColor: polkitAgent.flow?.failed ? Colors.palette.m3onError : Colors.tPalette.m3onSurfaceVariant placeholderTextColor: polkitAgent.flow?.failed ? Colors.palette.m3onError : Colors.tPalette.m3onSurfaceVariant
selectByMouse: true selectByMouse: true
font: Tokens.font.body.small
background: CustomRect { background: CustomRect {
color: (polkitAgent.flow?.failed && passInput.text === "") ? Colors.palette.m3error : Colors.tPalette.m3surfaceVariant color: (polkitAgent.flow?.failed && passInput.text === "") ? Colors.palette.m3error : Colors.tPalette.m3surfaceVariant
@@ -342,8 +341,7 @@ Scope {
visible: panelWindow.visible visible: panelWindow.visible
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
anchors { anchors {
Modules/Resources/Cards/HeroCard.qml
+5 -8
View File
@@ -27,8 +27,7 @@ CustomClippingRect {
implicitWidth: parent.width * root.usage implicitWidth: parent.width * root.usage
Behavior on implicitWidth { Behavior on implicitWidth {
Anim { Anim {}
}
} }
} }
@@ -45,8 +44,7 @@ CustomClippingRect {
value: root.usage value: root.usage
Behavior on clampedVal { Behavior on clampedVal {
Anim { Anim {}
}
} }
MaterialIcon { MaterialIcon {
@@ -54,7 +52,7 @@ CustomClippingRect {
anchors.centerIn: parent anchors.centerIn: parent
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: root.icon text: root.icon
} }
} }
@@ -125,15 +123,14 @@ CustomClippingRect {
anchors.right: parent.right anchors.right: parent.right
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: qsTr("Usage") text: qsTr("Usage")
} }
CustomText { CustomText {
anchors.right: parent.right anchors.right: parent.right
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.headline.builders.small.width(50).build()
font.weight: Font.Medium
text: isNaN(root.usage) ? "...%" : Math.round(root.usage * 100) + "%" text: isNaN(root.usage) ? "...%" : Math.round(root.usage * 100) + "%"
} }
} }
Modules/Resources/Cards/MemoryCard.qml
+2 -3
View File
@@ -51,8 +51,7 @@ CustomRect {
value: Memory.percentage value: Memory.percentage
Behavior on clampedVal { Behavior on clampedVal {
Anim { Anim {}
}
} }
ColumnLayout { ColumnLayout {
@@ -65,7 +64,7 @@ CustomRect {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: Math.round(Memory.percentage * 100) + "%" text: Math.round(Memory.percentage * 100) + "%"
} }
Modules/Resources/Cards/StorageCard.qml
+4 -6
View File
@@ -43,8 +43,7 @@ CustomRect {
value: root.percentage value: root.percentage
Behavior on clampedVal { Behavior on clampedVal {
Anim { Anim {}
}
} }
ColumnLayout { ColumnLayout {
@@ -56,14 +55,14 @@ CustomRect {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: "hard_drive" text: "hard_drive"
} }
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: Math.round(root.percentage * 100) + "%" text: Math.round(root.percentage * 100) + "%"
} }
@@ -112,8 +111,7 @@ CustomRect {
model: Storage.disks model: Storage.disks
DiskItem { DiskItem {}
}
} }
} }
} }
Modules/Resources/Cards/VramCard.qml
+2 -3
View File
@@ -53,8 +53,7 @@ CustomRect {
value: Gpu.memoryUsed / Gpu.memoryTotal value: Gpu.memoryUsed / Gpu.memoryTotal
Behavior on clampedVal { Behavior on clampedVal {
Anim { Anim {}
}
} }
ColumnLayout { ColumnLayout {
@@ -67,7 +66,7 @@ CustomRect {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: root.accent color: root.accent
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: Math.round(circularIndicator.value * 100) + "%" text: Math.round(circularIndicator.value * 100) + "%"
} }
Modules/Settings/Common/AudioDeviceList.qml
+4 -5
View File
@@ -60,12 +60,11 @@ ItemList {
anchors.centerIn: parent anchors.centerIn: parent
color: device.active ? Colors.palette.m3onPrimary : Colors.palette.m3onSecondaryContainer color: device.active ? Colors.palette.m3onPrimary : Colors.palette.m3onSecondaryContainer
fill: device.active ? 1 : 0 fill: device.active ? 1 : 0
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
text: root.iconName text: root.iconName
Behavior on fill { Behavior on fill {
Anim { Anim {}
}
} }
} }
} }
@@ -73,13 +72,13 @@ ItemList {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller font: Tokens.font.body.small
text: device.modelData?.description || device.modelData?.name || qsTr("Unknown") text: device.modelData?.description || device.modelData?.name || qsTr("Unknown")
} }
MaterialIcon { MaterialIcon {
color: Colors.palette.m3primary color: Colors.palette.m3primary
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.medium
opacity: device.active ? 1 : 0 opacity: device.active ? 1 : 0
text: "check" text: "check"
Modules/Settings/Common/BlobPopup.qml
+3 -5
View File
@@ -35,8 +35,7 @@ Item {
smoothing: Tokens.rounding.largeIncreased smoothing: Tokens.rounding.largeIncreased
Behavior on color { Behavior on color {
CAnim { CAnim {}
}
} }
} }
@@ -49,8 +48,7 @@ Item {
radius: root.open ? Tokens.rounding.largeIncreased : Tokens.rounding.largeIncreased radius: root.open ? Tokens.rounding.largeIncreased : Tokens.rounding.largeIncreased
Behavior on anchors.margins { Behavior on anchors.margins {
Anim { Anim {}
}
} }
Behavior on radius { Behavior on radius {
Anim { Anim {
@@ -122,7 +120,7 @@ Item {
anchors.centerIn: parent anchors.centerIn: parent
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
text: "view_apps" text: "view_apps"
} }
} }
Modules/Settings/Common/DialogRowButton.qml
+1 -1
View File
@@ -185,7 +185,7 @@ Item {
spacing: 0 spacing: 0
CustomText { CustomText {
font.pointSize: Tokens.font.size.large font: Tokens.font.title.builders.large.weight(Font.Normal).build()
text: root.header text: root.header
} }
Modules/Settings/Common/DialogSelectButton.qml
+1 -2
View File
@@ -65,7 +65,6 @@ DialogRowButton {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller
text: root.labelFor(item.modelData) text: root.labelFor(item.modelData)
} }
@@ -76,7 +75,7 @@ DialogRowButton {
anchors.right: parent.right anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onTertiaryContainer color: Colors.palette.m3onTertiaryContainer
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
opacity: item.selected ? 1 : 0 opacity: item.selected ? 1 : 0
text: "check" text: "check"
Modules/Settings/Common/InfoRow.qml
+4 -4
View File
@@ -24,7 +24,7 @@ ConnectedRect {
MaterialIcon { MaterialIcon {
color: root.iconColor color: root.iconColor
font.pointSize: Tokens.font.size.small fontStyle: Tokens.font.icon.small
text: root.icon text: root.icon
} }
} }
@@ -53,14 +53,14 @@ ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
} }
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: root.subtext text: root.subtext
visible: root.subtext visible: root.subtext
} }
@@ -72,7 +72,7 @@ ConnectedRect {
Layout.maximumWidth: root.width / 2 Layout.maximumWidth: root.width / 2
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
horizontalAlignment: Text.AlignRight horizontalAlignment: Text.AlignRight
} }
} }
Modules/Settings/Common/ItemList.qml
+3 -4
View File
@@ -23,8 +23,7 @@ ConnectedRect {
implicitHeight: (showList && list.count > 0 ? list.contentHeight : placeholder.implicitHeight + Tokens.padding.extraLarge * 2) + extraHeight implicitHeight: (showList && list.count > 0 ? list.contentHeight : placeholder.implicitHeight + Tokens.padding.extraLarge * 2) + extraHeight
Behavior on implicitHeight { Behavior on implicitHeight {
Anim { Anim {}
}
} }
Loader { Loader {
@@ -46,7 +45,7 @@ ConnectedRect {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
animate: true animate: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.large
text: root.placeholderIcon text: root.placeholderIcon
} }
@@ -54,7 +53,7 @@ ConnectedRect {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
animate: true animate: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: root.placeholderText text: root.placeholderText
} }
} }
Modules/Settings/Common/ListEditor.qml
+5 -8
View File
@@ -54,14 +54,12 @@ ListView {
} }
} }
Behavior on implicitHeight { Behavior on implicitHeight {
Anim { Anim {}
}
} }
model: DelegateModel { model: DelegateModel {
id: visualModel id: visualModel
delegate: ListRow { delegate: ListRow {}
}
model: ScriptModel { model: ScriptModel {
id: valuesModel id: valuesModel
} }
@@ -280,7 +278,7 @@ ListView {
id: dragIcon id: dragIcon
color: Qt.alpha(Colors.palette.m3onSurfaceVariant, enabledSwitch.checked ? 1 : 0.5) color: Qt.alpha(Colors.palette.m3onSurfaceVariant, enabledSwitch.checked ? 1 : 0.5)
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
text: "drag_indicator" text: "drag_indicator"
} }
@@ -290,7 +288,6 @@ ListView {
Layout.fillWidth: true Layout.fillWidth: true
color: Qt.alpha(Colors.palette.m3onSurface, enabledSwitch.checked ? 1 : 0.5) color: Qt.alpha(Colors.palette.m3onSurface, enabledSwitch.checked ? 1 : 0.5)
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller
text: root.labelFor(item.modelData) text: root.labelFor(item.modelData)
} }
@@ -298,13 +295,13 @@ ListView {
id: enabledSwitch id: enabledSwitch
checked: root.toggledFor(item.modelData) checked: root.toggledFor(item.modelData)
font.pointSize: Tokens.font.size.normal font: Tokens.font.icon.medium
onToggled: root.itemToggled(item.DelegateModel.itemsIndex, checked) onToggled: root.itemToggled(item.DelegateModel.itemsIndex, checked)
} }
IconButton { IconButton {
font.pointSize: Tokens.font.size.large font: Tokens.font.icon.medium
icon: "delete" icon: "delete"
inactiveOnColor: Colors.palette.m3error inactiveOnColor: Colors.palette.m3error
isRound: true isRound: true
Modules/Settings/Common/NavRow.qml
+3 -66
View File
@@ -1,71 +1,8 @@
pragma ComponentBehavior: Bound pragma ComponentBehavior: Bound
import QtQuick import QtQuick
import QtQuick.Layouts
import qs.Components
import ZShell.Config
import qs.Services
ConnectedRect { RowButton {
id: root trailingIcon: "chevron_right"
subLabel.animate: true
property alias icon: icon.text
property alias status: status.text
property alias text: label.text
signal clicked
Layout.fillWidth: true
implicitHeight: navLayout.implicitHeight + navLayout.anchors.margins * 2
StateLayer {
onClicked: root.clicked()
}
RowLayout {
id: navLayout
anchors.fill: parent
anchors.leftMargin: Tokens.padding.largeIncreased
anchors.margins: Tokens.padding.small
anchors.rightMargin: Tokens.padding.largeIncreased
spacing: Tokens.spacing.medium
MaterialIcon {
id: icon
color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.large
}
ColumnLayout {
Layout.fillWidth: true
spacing: 0
CustomText {
id: label
Layout.fillWidth: true
elide: Text.ElideRight
font.pointSize: Tokens.font.size.small
}
CustomText {
id: status
Layout.fillWidth: true
animate: true
color: Colors.palette.m3outline
elide: Text.ElideRight
font.pointSize: Tokens.font.size.small
visible: text
}
}
MaterialIcon {
color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal
text: "chevron_right"
}
}
} }
Modules/Settings/Common/PageBase.qml
+2 -1
View File
@@ -134,6 +134,7 @@ ColumnLayout {
inactiveOnColor: Colors.palette.m3onSurfaceVariant inactiveOnColor: Colors.palette.m3onSurfaceVariant
isRound: true isRound: true
type: IconButton.Tonal type: IconButton.Tonal
font: Tokens.font.icon.medium
onClicked: root.sState.closeSubPage() onClicked: root.sState.closeSubPage()
} }
@@ -142,7 +143,7 @@ ColumnLayout {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.large font: Tokens.font.title.large
text: root.title text: root.title
} }
} }
Modules/Settings/Common/PopupRow.qml
+3 -3
View File
@@ -40,7 +40,7 @@ ConnectedRect {
id: icon id: icon
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.larger fontStyle: Tokens.font.icon.medium
} }
ColumnLayout { ColumnLayout {
@@ -52,7 +52,7 @@ ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
} }
CustomText { CustomText {
@@ -62,7 +62,7 @@ ConnectedRect {
animate: true animate: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
visible: text visible: text
} }
} }
Modules/Settings/Common/RowButton.qml
+3 -4
View File
@@ -51,7 +51,7 @@ ConnectedRect {
visible: root.icon !== "" visible: root.icon !== ""
fill: 1 fill: 1
text: root.icon text: root.icon
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
} }
Column { Column {
@@ -66,7 +66,6 @@ ConnectedRect {
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small
} }
CustomText { CustomText {
@@ -76,7 +75,7 @@ ConnectedRect {
anchors.right: parent.right anchors.right: parent.right
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
visible: text visible: text
} }
} }
@@ -108,7 +107,7 @@ ConnectedRect {
sourceComponent: MaterialIcon { sourceComponent: MaterialIcon {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
text: root.trailingIcon text: root.trailingIcon
} }
} }
Modules/Settings/Common/SearchPopup.qml
+4 -5
View File
@@ -70,7 +70,6 @@ DialogRowButton {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller
text: item.modelData text: item.modelData
} }
@@ -81,7 +80,7 @@ DialogRowButton {
anchors.right: parent.right anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: Colors.palette.m3onTertiaryContainer color: Colors.palette.m3onTertiaryContainer
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
opacity: item.selected ? 1 : 0 opacity: item.selected ? 1 : 0
text: "check" text: "check"
@@ -100,12 +99,12 @@ DialogRowButton {
Layout.fillWidth: true Layout.fillWidth: true
bg.border.color: Colors.palette.m3outlineVariant bg.border.color: Colors.palette.m3outlineVariant
bg.color: Colors.tPalette.m3surfaceContainerLowest bg.color: Colors.tPalette.m3surfaceContainerLowest
clearIcon.font.pointSize: Tokens.font.size.large clearIcon.font: Tokens.font.icon.medium
clearIcon.padding: Tokens.padding.extraSmall clearIcon.padding: Tokens.padding.extraSmall
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
placeholderText: qsTr("Search...") placeholderText: qsTr("Search...")
searchIcon.anchors.leftMargin: Tokens.padding.large searchIcon.anchors.leftMargin: Tokens.padding.large
searchIcon.font.pointSize: Tokens.font.size.large searchIcon.fontStyle: Tokens.font.icon.medium
Behavior on bg.border.color { Behavior on bg.border.color {
CAnim {} CAnim {}
Modules/Settings/Common/SectionHeader.qml
+1 -1
View File
@@ -13,5 +13,5 @@ CustomText {
Layout.topMargin: first ? 0 : Tokens.spacing.largeIncreased - ((parent as ColumnLayout).spacing ?? 0) Layout.topMargin: first ? 0 : Tokens.spacing.largeIncreased - ((parent as ColumnLayout).spacing ?? 0)
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.normal font: Tokens.font.label.medium
} }
Modules/Settings/Common/SelectRow.qml
+2 -2
View File
@@ -40,14 +40,14 @@ ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller font: Tokens.font.body.small
} }
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: root.subtext text: root.subtext
visible: root.subtext visible: root.subtext
} }
Modules/Settings/Common/SliderRow.qml
+2 -2
View File
@@ -40,14 +40,14 @@ ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
} }
CustomText { CustomText {
id: valueLabel id: valueLabel
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
} }
} }
Modules/Settings/Common/SpinRow.qml
+2 -2
View File
@@ -39,14 +39,14 @@ ConnectedRect {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller font: Tokens.font.body.small
} }
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: root.subtext text: root.subtext
visible: root.subtext visible: root.subtext
} }
Modules/Settings/Common/TextFieldRow.qml
-1
View File
@@ -62,7 +62,6 @@ ConnectedRect {
visible: root.subtext visible: root.subtext
text: input.isError && root.errorText ? root.errorText : root.subtext text: input.isError && root.errorText ? root.errorText : root.subtext
color: input.isError && root.errorText ? Colors.palette.m3error : Colors.palette.m3outline color: input.isError && root.errorText ? Colors.palette.m3error : Colors.palette.m3outline
font.pointSize: Tokens.font.size.small
elide: Text.ElideRight elide: Text.ElideRight
animate: root.errorText animate: root.errorText
} }
Modules/Settings/Common/TimeDialogRow.qml
+1 -1
View File
@@ -193,7 +193,7 @@ Item {
spacing: 0 spacing: 0
CustomText { CustomText {
font.pointSize: Tokens.font.size.large font: Tokens.font.title.builders.large.weight(Font.Normal).build()
text: root.header text: root.header
} }
Modules/Settings/Common/TimeDialogToggle.qml
+2 -2
View File
@@ -34,14 +34,14 @@ ConnectedRect {
CustomText { CustomText {
id: text id: text
font.pointSize: Tokens.font.size.smaller font: Tokens.font.body.small
} }
CustomText { CustomText {
id: subtext id: subtext
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
} }
Modules/Settings/Common/TimeInput.qml
+2 -2
View File
@@ -137,7 +137,7 @@ ColumnLayout {
CustomText { CustomText {
id: startSeparator id: startSeparator
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.body.builders.large.size(28).weight(Font.DemiBold).build()
text: ":" text: ":"
} }
@@ -360,7 +360,7 @@ ColumnLayout {
CustomText { CustomText {
id: endSeparator id: endSeparator
font.pointSize: Tokens.font.size.extraLarge font: Tokens.font.body.builders.large.size(28).weight(Font.DemiBold).build()
text: ":" text: ":"
} }
Modules/Settings/Common/ToggleRow.qml
+3 -2
View File
@@ -20,6 +20,7 @@ CustomSwitch {
Layout.fillWidth: true Layout.fillWidth: true
cLayer: 2 cLayer: 2
font: Tokens.font.body.small
horizontalPadding: Tokens.padding.largeIncreased horizontalPadding: Tokens.padding.largeIncreased
implicitHeight: Math.max(implicitContentHeight, implicitIndicatorHeight) + verticalPadding * 2 implicitHeight: Math.max(implicitContentHeight, implicitIndicatorHeight) + verticalPadding * 2
implicitWidth: implicitContentWidth + implicitIndicatorWidth + horizontalPadding * 2 implicitWidth: implicitContentWidth + implicitIndicatorWidth + horizontalPadding * 2
@@ -59,7 +60,7 @@ CustomSwitch {
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.smaller font: root.font
opacity: root.enabled ? 1 : 0.5 opacity: root.enabled ? 1 : 0.5
text: root.text text: root.text
@@ -75,7 +76,7 @@ CustomSwitch {
anchors.right: parent.right anchors.right: parent.right
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
opacity: root.enabled ? 1 : 0.5 opacity: root.enabled ? 1 : 0.5
text: root.subtext text: root.subtext
visible: root.subtext visible: root.subtext
Modules/Settings/NavPane.qml
+4 -5
View File
@@ -18,16 +18,15 @@ ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
bg.border.color: Colors.palette.m3outlineVariant bg.border.color: Colors.palette.m3outlineVariant
bg.color: Colors.tPalette.m3surfaceContainerLowest bg.color: Colors.tPalette.m3surfaceContainerLowest
clearIcon.font.pointSize: Tokens.font.size.large clearIcon.font: Tokens.font.icon.medium
clearIcon.padding: Tokens.padding.extraSmall clearIcon.padding: Tokens.padding.extraSmall
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.large
placeholderText: qsTr("Search settings") placeholderText: qsTr("Search settings")
searchIcon.anchors.leftMargin: Tokens.padding.largeIncreased searchIcon.anchors.leftMargin: Tokens.padding.largeIncreased
searchIcon.font.pointSize: Tokens.font.size.large searchIcon.fontStyle: Tokens.font.icon.medium
Behavior on bg.border.color { Behavior on bg.border.color {
CAnim { CAnim {}
}
} }
Binding { Binding {
Modules/Settings/NavPane/NavLocations.qml
+10 -9
View File
@@ -107,7 +107,7 @@ VerticalFadeFlickable {
anchors.fill: parent anchors.fill: parent
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
spacing: Tokens.spacing.small spacing: Tokens.spacing.medium
CustomRect { CustomRect {
Layout.bottomMargin: -1 Layout.bottomMargin: -1
@@ -122,7 +122,7 @@ VerticalFadeFlickable {
anchors.verticalCenterOffset: 1 anchors.verticalCenterOffset: 1
color: item.isCurrentPage ? Colors.palette.m3onPrimary : Colors.palette.m3onSecondaryContainer color: item.isCurrentPage ? Colors.palette.m3onPrimary : Colors.palette.m3onSecondaryContainer
fill: item.modelData.noFill ? 0 : 1 fill: item.modelData.noFill ? 0 : 1
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.builders.medium.weight(Font.Medium).build()
grade: 25 grade: 25
text: item.modelData.icon text: item.modelData.icon
} }
@@ -135,6 +135,7 @@ VerticalFadeFlickable {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font: Tokens.font.body.medium
text: item.modelData.name text: item.modelData.name
} }
@@ -142,6 +143,7 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font: Tokens.font.label.small
text: item.modelData.description text: item.modelData.description
} }
} }
@@ -198,7 +200,7 @@ VerticalFadeFlickable {
MaterialIcon { MaterialIcon {
color: Colors.palette.m3primary color: Colors.palette.m3primary
fill: 1 fill: 1
font.pointSize: Tokens.font.size.large fontStyle: Tokens.font.icon.builders.medium.weight(Font.Medium).build()
text: group.modelData.icon text: group.modelData.icon
} }
@@ -206,7 +208,7 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3secondary color: Colors.palette.m3secondary
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.large font: Tokens.font.body.large
text: group.modelData.page text: group.modelData.page
} }
} }
@@ -283,7 +285,7 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: { text: {
const labels = result.modelData.crumbLabels.slice(1); const labels = result.modelData.crumbLabels.slice(1);
const section = result.modelData.section; const section = result.modelData.section;
@@ -297,7 +299,6 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3onSurface color: Colors.palette.m3onSurface
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.normal
text: SettingsSearcher.highlight(result.modelData.title, root.search, Colors.palette.m3primary) text: SettingsSearcher.highlight(result.modelData.title, root.search, Colors.palette.m3primary)
textFormat: text.includes("<font") ? Text.StyledText : Text.PlainText textFormat: text.includes("<font") ? Text.StyledText : Text.PlainText
} }
@@ -306,7 +307,7 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: SettingsSearcher.highlight(result.modelData.subtext, root.search, Colors.palette.m3primary) text: SettingsSearcher.highlight(result.modelData.subtext, root.search, Colors.palette.m3primary)
textFormat: text.includes("<font") ? Text.StyledText : Text.PlainText textFormat: text.includes("<font") ? Text.StyledText : Text.PlainText
visible: result.modelData.subtext.length > 0 visible: result.modelData.subtext.length > 0
@@ -319,7 +320,8 @@ VerticalFadeFlickable {
z: 1 z: 1
onClicked: { onClicked: {
root.sState.jumpToSetting(result.modelData.pageIdx, result.modelData.subPath, result.modelData.anchor); const target = result.modelData.targetSubPath;
root.sState.jumpToSetting(result.modelData.pageIdx, target.length > 0 ? target : result.modelData.subPath, target.length > 0 ? "" : result.modelData.anchor);
} }
} }
@@ -349,7 +351,6 @@ VerticalFadeFlickable {
Layout.fillWidth: true Layout.fillWidth: true
Layout.topMargin: Tokens.padding.large Layout.topMargin: Tokens.padding.large
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: qsTr("No matching settings") text: qsTr("No matching settings")
visible: root.searching && root.results.length === 0 visible: root.searching && root.results.length === 0
Modules/Settings/PageCompRegistry.qml
+1 -1
View File
@@ -182,7 +182,7 @@ QtObject {
MaterialIcon { MaterialIcon {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3outlineVariant color: Colors.palette.m3outlineVariant
font.pointSize: Tokens.font.size.extraLarge fontStyle: Tokens.font.icon.extraLarge
text: "handyman" text: "handyman"
} }
Modules/Settings/Pages/AboutPage.qml
+2 -2
View File
@@ -56,14 +56,14 @@ PageBase {
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.topMargin: Tokens.spacing.small Layout.topMargin: Tokens.spacing.small
font.pointSize: Tokens.font.size.large font: Tokens.font.headline.large
text: "ZShell" text: "ZShell"
} }
CustomText { CustomText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: ZUtils.version ? `v${ZUtils.version}` : "…" text: ZUtils.version ? `v${ZUtils.version}` : "…"
} }
} }
Modules/Settings/Pages/Apps/AllApps.qml
+4 -4
View File
@@ -67,7 +67,7 @@ PageBase {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: appItem.modelData.name text: appItem.modelData.name
} }
@@ -75,7 +75,7 @@ PageBase {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
text: (appItem.modelData.comment || appItem.modelData.genericName) ?? "" text: (appItem.modelData.comment || appItem.modelData.genericName) ?? ""
visible: text visible: text
} }
@@ -84,14 +84,14 @@ PageBase {
MaterialIcon { MaterialIcon {
color: Colors.palette.m3primary color: Colors.palette.m3primary
fill: 1 fill: 1
font.pointSize: Tokens.font.size.small fontStyle: Tokens.font.icon.small
text: "favorite" text: "favorite"
visible: Strings.testRegexList(Config.launcher.favoriteApps, appItem.modelData.id) visible: Strings.testRegexList(Config.launcher.favoriteApps, appItem.modelData.id)
} }
MaterialIcon { MaterialIcon {
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.normal fontStyle: Tokens.font.icon.medium
text: "chevron_right" text: "chevron_right"
} }
} }
Modules/Settings/Pages/Apps/AppInfo.qml
+3 -4
View File
@@ -57,7 +57,7 @@ PageBase {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
font.pointSize: Tokens.font.size.normal font: Tokens.font.body.medium
text: root.app?.name ?? "" text: root.app?.name ?? ""
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
@@ -65,7 +65,7 @@ PageBase {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: (root.app?.comment || root.app?.genericName) ?? "" text: (root.app?.comment || root.app?.genericName) ?? ""
visible: text visible: text
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
@@ -152,7 +152,7 @@ PageBase {
id: label id: label
Layout.alignment: Qt.AlignTop Layout.alignment: Qt.AlignTop
font.pointSize: Tokens.font.size.small font: Tokens.font.label.small
} }
Item { Item {
@@ -165,7 +165,6 @@ PageBase {
Layout.fillWidth: true Layout.fillWidth: true
Layout.maximumWidth: implicitWidth + 1 // Whyyyyyyyyy Layout.maximumWidth: implicitWidth + 1 // Whyyyyyyyyy
color: Colors.palette.m3onSurfaceVariant color: Colors.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small
wrapMode: Text.WrapAtWordBoundaryOrAnywhere wrapMode: Text.WrapAtWordBoundaryOrAnywhere
} }
} }
Modules/Settings/Pages/AppsPage.qml
+4 -4
View File
@@ -76,7 +76,7 @@ PageBase {
icon: "apps" icon: "apps"
last: true last: true
settingAnchor: "apps-all-apps" settingAnchor: "apps-all-apps"
status: qsTr("Browse installed apps, set favorites and hidden") subtext: qsTr("Browse installed apps, set favorites and hidden")
text: qsTr("All apps") text: qsTr("All apps")
onClicked: root.sState.openSubPage(1) onClicked: root.sState.openSubPage(1)
@@ -154,7 +154,7 @@ PageBase {
CustomText { CustomText {
Layout.fillWidth: true Layout.fillWidth: true
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: appItem.modelData.name text: appItem.modelData.name
} }
@@ -162,7 +162,7 @@ PageBase {
Layout.fillWidth: true Layout.fillWidth: true
color: Colors.palette.m3outline color: Colors.palette.m3outline
elide: Text.ElideRight elide: Text.ElideRight
font.pointSize: Tokens.font.size.small font: Tokens.font.body.small
text: (appItem.modelData.comment || appItem.modelData.genericName) ?? "" text: (appItem.modelData.comment || appItem.modelData.genericName) ?? ""
visible: text visible: text
} }
@@ -171,7 +171,7 @@ PageBase {
MaterialIcon { MaterialIcon {
color: Colors.palette.m3primary color: Colors.palette.m3primary
fill: 1 fill: 1
font.pointSize: Tokens.font.size.small fontStyle: Tokens.font.icon.small
text: "favorite" text: "favorite"
visible: Strings.testRegexList(Config.launcher.favoriteApps, appItem.modelData.id) visible: Strings.testRegexList(Config.launcher.favoriteApps, appItem.modelData.id)
} }
Modules/Settings/Pages/Audio/AppVolumes.qml
-1
View File
@@ -28,7 +28,6 @@ PageBase {
Layout.fillWidth: true Layout.fillWidth: true
Layout.leftMargin: Tokens.padding.extraSmall Layout.leftMargin: Tokens.padding.extraSmall
color: Colors.palette.m3outline color: Colors.palette.m3outline
font.pointSize: Tokens.font.size.small
text: qsTr("Adjust the volume of individual apps currently playing audio.") text: qsTr("Adjust the volume of individual apps currently playing audio.")
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }

Some files were not shown because too many files have changed in this diff Show More