feat: initial commit for pixel-snapping components and helpers

This commit is contained in:
2026-10-29 17:34:57 +01:00
parent 9d8bde1413
commit 9cbb90f9e1
163 changed files with 2671 additions and 951 deletions
+20 -12
View File
@@ -1,5 +1,7 @@
import QtQuick
import QtQuick.Layouts
import ZShell
import ZShell.Components
import ZShell.Config
import qs.Components
import qs.Services
@@ -15,8 +17,8 @@ CustomRect {
required property real usage
color: Colors.tPalette.m3surfaceContainer
implicitHeight: Math.max(tempProg.implicitHeight + detailsRow.implicitHeight + Tokens.spacing.largeIncreased, usageColumn.implicitHeight + usageLabel.implicitHeight) + Tokens.padding.large * 2
implicitWidth: 450
implicitHeight: ZUtils.snap(Math.max(tempProg.implicitHeight + detailsRow.implicitHeight + Tokens.spacing.largeIncreased, usageColumn.implicitHeight + usageLabel.implicitHeight) + Tokens.padding.large * 2, root)
implicitWidth: ZUtils.snapCeil(450, root)
radius: Tokens.rounding.largeIncreased
ClipRect {
@@ -43,7 +45,7 @@ CustomRect {
anchors.margins: Tokens.padding.large
anchors.top: parent.top
fgColor: root.accent
implicitSize: Math.max(icon.implicitWidth, icon.implicitHeight) + Tokens.padding.small * 2
implicitSize: ZUtils.snap(Math.max(icon.implicitWidth, icon.implicitHeight) + Tokens.padding.small * 2, root)
spacing: Tokens.spacing.extraSmall
strokeWidth: Tokens.padding.extraSmall
value: root.usage
@@ -62,12 +64,14 @@ CustomRect {
}
}
ColumnLayout {
SnapLayout {
anchors.left: tempProg.right
anchors.margins: Tokens.spacing.largeIncreased
anchors.right: usageColumn.left
anchors.verticalCenter: tempProg.verticalCenter
spacing: Tokens.spacing.extraSmall
orientation: Qt.Vertical
CustomText {
color: root.accent
@@ -82,15 +86,17 @@ CustomRect {
}
}
ColumnLayout {
SnapLayout {
id: detailsRow
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.margins: Tokens.padding.largeIncreased
spacing: Tokens.spacing.extraSmall
RowLayout {
spacing: Tokens.spacing.extraSmall
orientation: Qt.Vertical
SnapLayout {
Layout.leftMargin: -Tokens.padding.extraSmall
spacing: Tokens.spacing.extraSmall
@@ -108,32 +114,34 @@ CustomRect {
CustomProgressBar {
fgColor: root.accent
implicitHeight: Tokens.padding.extraSmall
implicitHeight: Tokens.padding.small
indeterminate: isNaN(root.usage) || isNaN(root.temperature)
value: root.temperature / 100
}
}
Column {
SnapLayout {
id: usageColumn
anchors.margins: Tokens.padding.large
anchors.right: parent.right
anchors.rightMargin: 32
anchors.rightMargin: Tokens.padding.extraLarge
anchors.verticalCenter: parent.verticalCenter
spacing: 0
orientation: Qt.Vertical
CustomText {
id: usageLabel
anchors.right: parent.right
Layout.alignment: Qt.AlignRight
color: Colors.palette.m3onSurfaceVariant
font: Tokens.font.body.medium
text: qsTr("Usage")
}
CustomText {
anchors.right: parent.right
Layout.alignment: Qt.AlignRight
color: root.accent
font: Tokens.font.headline.builders.small.width(50).build()
text: isNaN(root.usage) ? "...%" : Math.round(root.usage * 100) + "%"