feat: initial commit for pixel-snapping components and helpers
This commit is contained in:
@@ -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) + "%"
|
||||
|
||||
Reference in New Issue
Block a user