refactor: replace scaled spacing with new tokens

This commit is contained in:
2 * r + 2 * t 2026-04-20 19:58:21 +10:00
parent 52272c062d
commit 7cb3944af7
36 changed files with 54 additions and 54 deletions

View file

@ -9,7 +9,7 @@ ColumnLayout {
required property var deviceDetails required property var deviceDetails
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
text: qsTr("IP Address") text: qsTr("IP Address")

View file

@ -11,7 +11,7 @@ ColumnLayout {
required property string value required property string value
property bool showTopMargin: false property bool showTopMargin: false
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
Layout.topMargin: root.showTopMargin ? Tokens.spacing.medium : 0 Layout.topMargin: root.showTopMargin ? Tokens.spacing.medium : 0

View file

@ -76,7 +76,7 @@ ColumnLayout {
id: contentWrapper id: contentWrapper
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: root.expanded ? (contentColumn.implicitHeight + Tokens.spacing.small * 2) : 0 Layout.preferredHeight: root.expanded ? (contentColumn.implicitHeight + Tokens.spacing.large) : 0
clip: true clip: true
Behavior on Layout.preferredHeight { Behavior on Layout.preferredHeight {

View file

@ -33,7 +33,7 @@ Row {
property color disabledColour: Qt.alpha(Colours.palette.m3onSurface, 0.1) property color disabledColour: Qt.alpha(Colours.palette.m3onSurface, 0.1)
property color disabledTextColour: Qt.alpha(Colours.palette.m3onSurface, 0.38) property color disabledTextColour: Qt.alpha(Colours.palette.m3onSurface, 0.38)
spacing: Math.floor(Tokens.spacing.small / 2) spacing: Math.floor(Tokens.spacing.extraSmall)
StyledRect { StyledRect {
radius: implicitHeight / 2 * Math.min(1, Tokens.rounding.scale) radius: implicitHeight / 2 * Math.min(1, Tokens.rounding.scale)

View file

@ -83,7 +83,7 @@ Item {
anchors.margins: Tokens.padding.extraSmall + Tokens.padding.medium anchors.margins: Tokens.padding.extraSmall + Tokens.padding.medium
cellWidth: Sizes.itemWidth + Tokens.spacing.small cellWidth: Sizes.itemWidth + Tokens.spacing.small
cellHeight: Sizes.itemWidth + Tokens.spacing.small * 2 + Tokens.padding.medium * 2 + 1 cellHeight: Sizes.itemWidth + Tokens.spacing.large + Tokens.padding.medium * 2 + 1
clip: true clip: true
focus: true focus: true

View file

@ -24,7 +24,7 @@ StyledRect {
anchors.right: parent.right anchors.right: parent.right
anchors.top: parent.top anchors.top: parent.top
anchors.margins: Tokens.padding.medium anchors.margins: Tokens.padding.medium
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter

View file

@ -64,7 +64,7 @@ StyledClippingRect {
id: layout id: layout
anchors.centerIn: parent anchors.centerIn: parent
spacing: Math.floor(Tokens.spacing.small / 2) spacing: Math.floor(Tokens.spacing.extraSmall)
Repeater { Repeater {
id: workspaces id: workspaces

View file

@ -73,7 +73,7 @@ Item {
StyledText { StyledText {
Layout.topMargin: Tokens.spacing.medium Layout.topMargin: Tokens.spacing.medium
Layout.bottomMargin: -Tokens.spacing.small / 2 Layout.bottomMargin: -Tokens.spacing.extraSmall
text: qsTr("Volume (%1)").arg(Audio.muted ? qsTr("Muted") : `${Math.round(Audio.volume * 100)}%`) text: qsTr("Volume (%1)").arg(Audio.muted ? qsTr("Muted") : `${Math.round(Audio.volume * 100)}%`)
font.weight: 500 font.weight: 500
} }

View file

@ -96,8 +96,8 @@ ColumnLayout {
} }
StyledText { StyledText {
Layout.leftMargin: Tokens.spacing.small / 2 Layout.leftMargin: Tokens.spacing.extraSmall
Layout.rightMargin: Tokens.spacing.small / 2 Layout.rightMargin: Tokens.spacing.extraSmall
Layout.fillWidth: true Layout.fillWidth: true
text: device.modelData.name text: device.modelData.name
elide: Text.ElideRight elide: Text.ElideRight

View file

@ -101,8 +101,8 @@ ColumnLayout {
} }
StyledText { StyledText {
Layout.leftMargin: Tokens.spacing.small / 2 Layout.leftMargin: Tokens.spacing.extraSmall
Layout.rightMargin: Tokens.spacing.small / 2 Layout.rightMargin: Tokens.spacing.extraSmall
Layout.fillWidth: true Layout.fillWidth: true
text: networkItem.modelData.ssid text: networkItem.modelData.ssid
elide: Text.ElideRight elide: Text.ElideRight
@ -278,8 +278,8 @@ ColumnLayout {
} }
StyledText { StyledText {
Layout.leftMargin: Tokens.spacing.small / 2 Layout.leftMargin: Tokens.spacing.extraSmall
Layout.rightMargin: Tokens.spacing.small / 2 Layout.rightMargin: Tokens.spacing.extraSmall
Layout.fillWidth: true Layout.fillWidth: true
text: ethernetItem.modelData.interface || qsTr("Unknown") text: ethernetItem.modelData.interface || qsTr("Unknown")
elide: Text.ElideRight elide: Text.ElideRight

View file

@ -180,7 +180,7 @@ StackView {
sourceComponent: Item { sourceComponent: Item {
implicitWidth: back.implicitWidth implicitWidth: back.implicitWidth
implicitHeight: back.implicitHeight + Tokens.spacing.small / 2 implicitHeight: back.implicitHeight + Tokens.spacing.extraSmall
Item { Item {
anchors.bottom: parent.bottom anchors.bottom: parent.bottom

View file

@ -394,7 +394,7 @@ ColumnLayout {
implicitHeight: Tokens.font.size.normal implicitHeight: Tokens.font.size.normal
orientation: Qt.Horizontal orientation: Qt.Horizontal
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
interactive: false interactive: false
model: ScriptModel { model: ScriptModel {

View file

@ -219,7 +219,7 @@ Item {
anchors.horizontalCenter: icon.horizontalCenter anchors.horizontalCenter: icon.horizontalCenter
anchors.top: icon.bottom anchors.top: icon.bottom
anchors.topMargin: Tokens.spacing.small / 2 anchors.topMargin: Tokens.spacing.extraSmall
text: item.label text: item.label
font.pointSize: Tokens.font.size.small font.pointSize: Tokens.font.size.small

View file

@ -18,7 +18,7 @@ CollapsibleSection {
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
Repeater { Repeater {
model: Schemes.list model: Schemes.list

View file

@ -18,7 +18,7 @@ CollapsibleSection {
ColumnLayout { ColumnLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
Repeater { Repeater {
model: M3Variants.list model: M3Variants.list

View file

@ -38,7 +38,7 @@ CollapsibleSection {
property alias contentHeight: sansFontList.contentHeight property alias contentHeight: sansFontList.contentHeight
clip: true clip: true
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
model: Qt.fontFamilies() model: Qt.fontFamilies()
StyledScrollBar.vertical: StyledScrollBar { StyledScrollBar.vertical: StyledScrollBar {
@ -119,7 +119,7 @@ CollapsibleSection {
property alias contentHeight: monoFontList.contentHeight property alias contentHeight: monoFontList.contentHeight
clip: true clip: true
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
model: Qt.fontFamilies() model: Qt.fontFamilies()
StyledScrollBar.vertical: StyledScrollBar { StyledScrollBar.vertical: StyledScrollBar {
@ -202,7 +202,7 @@ CollapsibleSection {
property alias contentHeight: materialFontList.contentHeight property alias contentHeight: materialFontList.contentHeight
clip: true clip: true
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
model: Qt.fontFamilies().filter(f => f.startsWith("Material Symbols")) model: Qt.fontFamilies().filter(f => f.startsWith("Material Symbols"))
StyledScrollBar.vertical: StyledScrollBar { StyledScrollBar.vertical: StyledScrollBar {

View file

@ -348,7 +348,7 @@ StyledFlickable {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
text: root.device?.batteryAvailable ? qsTr("Device battery (%1%)").arg(root.device.battery * 100) : qsTr("Battery unavailable") text: root.device?.batteryAvailable ? qsTr("Device battery (%1%)").arg(root.device.battery * 100) : qsTr("Battery unavailable")
@ -357,10 +357,10 @@ StyledFlickable {
RowLayout { RowLayout {
id: batteryPercent id: batteryPercent
Layout.topMargin: Tokens.spacing.small / 2 Layout.topMargin: Tokens.spacing.extraSmall
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: Tokens.padding.small Layout.preferredHeight: Tokens.padding.small
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledRect { StyledRect {
Layout.fillWidth: true Layout.fillWidth: true

View file

@ -468,7 +468,7 @@ ColumnLayout {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
text: qsTr("Adapter state") text: qsTr("Adapter state")

View file

@ -78,7 +78,7 @@ ColumnLayout {
model: root.model model: root.model
delegate: root.delegate delegate: root.delegate
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
interactive: false interactive: false
clip: false clip: false
} }

View file

@ -296,7 +296,7 @@ Item {
Layout.fillHeight: true Layout.fillHeight: true
model: root.filteredApps model: root.filteredApps
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
clip: true clip: true
StyledScrollBar.vertical: StyledScrollBar { StyledScrollBar.vertical: StyledScrollBar {

View file

@ -69,7 +69,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Max shown items") label: qsTr("Max shown items")
@ -96,7 +96,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Special prefix") label: qsTr("Special prefix")
@ -165,7 +165,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Item width") label: qsTr("Item width")
@ -198,7 +198,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Total hidden") label: qsTr("Total hidden")

View file

@ -77,7 +77,7 @@ DeviceDetails {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Interface") label: qsTr("Interface")

View file

@ -49,7 +49,7 @@ ColumnLayout {
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
anchors.margins: Tokens.padding.large anchors.margins: Tokens.padding.large
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
text: qsTr("Total devices") text: qsTr("Total devices")

View file

@ -31,7 +31,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Total devices") label: qsTr("Total devices")
@ -106,7 +106,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Network") label: qsTr("Network")

View file

@ -181,7 +181,7 @@ DeviceDetails {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Provider") label: qsTr("Provider")

View file

@ -120,7 +120,7 @@ DeviceDetails {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("SSID") label: qsTr("SSID")

View file

@ -321,7 +321,7 @@ Item {
implicitHeight: Tokens.font.size.normal implicitHeight: Tokens.font.size.normal
orientation: Qt.Horizontal orientation: Qt.Horizontal
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
interactive: false interactive: false
model: ScriptModel { model: ScriptModel {

View file

@ -45,7 +45,7 @@ ColumnLayout {
} }
SectionContainer { SectionContainer {
contentSpacing: Tokens.spacing.small / 2 contentSpacing: Tokens.spacing.extraSmall
PropertyRow { PropertyRow {
label: qsTr("Connected network") label: qsTr("Connected network")

View file

@ -25,7 +25,7 @@ Item {
Layout.fillWidth: true Layout.fillWidth: true
Column { Column {
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
text: Weather.city || qsTr("Loading...") text: Weather.city || qsTr("Loading...")
@ -176,7 +176,7 @@ Item {
} }
StyledText { StyledText {
Layout.topMargin: -Tokens.spacing.small / 2 Layout.topMargin: -Tokens.spacing.extraSmall
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
text: new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale(), "MMM d") text: new Date(forecastItem.modelData.date).toLocaleDateString(Qt.locale(), "MMM d")
font.pointSize: Tokens.font.size.small font.pointSize: Tokens.font.size.small

View file

@ -22,7 +22,7 @@ Item {
} }
implicitWidth: image.width + Tokens.padding.medium * 2 implicitWidth: image.width + Tokens.padding.medium * 2
implicitHeight: image.height + label.height + Tokens.spacing.small / 2 + Tokens.padding.large + Tokens.padding.medium implicitHeight: image.height + label.height + Tokens.spacing.extraSmall + Tokens.padding.large + Tokens.padding.medium
StateLayer { StateLayer {
radius: Tokens.rounding.large radius: Tokens.rounding.large
@ -75,7 +75,7 @@ Item {
id: label id: label
anchors.top: image.bottom anchors.top: image.bottom
anchors.topMargin: Tokens.spacing.small / 2 anchors.topMargin: Tokens.spacing.extraSmall
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
width: image.width - Tokens.padding.medium * 2 width: image.width - Tokens.padding.medium * 2

View file

@ -77,7 +77,7 @@ Item {
implicitHeight: Tokens.font.size.normal implicitHeight: Tokens.font.size.normal
orientation: Qt.Horizontal orientation: Qt.Horizontal
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
interactive: false interactive: false
model: ScriptModel { model: ScriptModel {

View file

@ -143,7 +143,7 @@ StyledRect {
Layout.topMargin: -Tokens.padding.extraSmall Layout.topMargin: -Tokens.padding.extraSmall
Layout.bottomMargin: -Tokens.padding.extraSmall / 2 - (root.expanded ? 0 : spacing) Layout.bottomMargin: -Tokens.padding.extraSmall / 2 - (root.expanded ? 0 : spacing)
Layout.fillWidth: true Layout.fillWidth: true
spacing: Math.round(Tokens.spacing.small / 2) spacing: Math.round(Tokens.spacing.extraSmall)
RowLayout { RowLayout {
Layout.bottomMargin: -parent.spacing Layout.bottomMargin: -parent.spacing
@ -184,7 +184,7 @@ StyledRect {
id: expandBtn id: expandBtn
anchors.centerIn: parent anchors.centerIn: parent
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
id: groupCount id: groupCount

View file

@ -117,7 +117,7 @@ StyledRect {
anchors.top: summary.bottom anchors.top: summary.bottom
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
anchors.topMargin: Tokens.spacing.small / 2 anchors.topMargin: Tokens.spacing.extraSmall
sourceComponent: ExpandedBody {} sourceComponent: ExpandedBody {}
} }

View file

@ -32,7 +32,7 @@ StyledRect {
} }
readonly property int nonAnimHeight: { readonly property int nonAnimHeight: {
const headerHeight = header.implicitHeight + (root.expanded ? Math.round(Tokens.spacing.small / 2) : 0); const headerHeight = header.implicitHeight + (root.expanded ? Math.round(Tokens.spacing.extraSmall) : 0);
const columnHeight = headerHeight + notifList.layoutHeight; const columnHeight = headerHeight + notifList.layoutHeight;
return Math.round(Math.max(TokenConfig.sizes.notifs.image, columnHeight) + Tokens.padding.medium * 2); return Math.round(Math.max(TokenConfig.sizes.notifs.image, columnHeight) + Tokens.padding.medium * 2);
} }
@ -157,7 +157,7 @@ StyledRect {
id: column id: column
Layout.fillWidth: true Layout.fillWidth: true
spacing: root.expanded ? Math.round(Tokens.spacing.small / 2) : 0 spacing: root.expanded ? Math.round(Tokens.spacing.extraSmall) : 0
Behavior on spacing { Behavior on spacing {
Anim {} Anim {}
@ -201,7 +201,7 @@ StyledRect {
id: expandBtn id: expandBtn
anchors.centerIn: parent anchors.centerIn: parent
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
StyledText { StyledText {
id: groupCount id: groupCount

View file

@ -22,7 +22,7 @@ LazyListView {
anchors.right: parent.right anchors.right: parent.right
implicitHeight: contentHeight implicitHeight: contentHeight
spacing: Math.round(Tokens.spacing.small / 2) spacing: Math.round(Tokens.spacing.extraSmall)
asynchronous: true asynchronous: true
readyDelay: 1 readyDelay: 1

View file

@ -78,13 +78,13 @@ ColumnLayout {
anchors.left: list.contentItem.left anchors.left: list.contentItem.left
anchors.right: list.contentItem.right anchors.right: list.contentItem.right
anchors.rightMargin: Tokens.spacing.small anchors.rightMargin: Tokens.spacing.small
spacing: Tokens.spacing.small / 2 spacing: Tokens.spacing.extraSmall
Component.onCompleted: baseName = modelData.baseName Component.onCompleted: baseName = modelData.baseName
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
Layout.rightMargin: Tokens.spacing.small / 2 Layout.rightMargin: Tokens.spacing.extraSmall
text: { text: {
const time = recording.baseName; const time = recording.baseName;
const matches = time.match(/^recording_(\d{4})(\d{2})(\d{2})_(\d{2})-(\d{2})-(\d{2})/); const matches = time.match(/^recording_(\d{4})(\d{2})(\d{2})_(\d{2})-(\d{2})-(\d{2})/);