refactor: migrate controlcenter network to new font API

This commit is contained in:
2 * r + 2 * t 2026-04-21 01:06:03 +10:00
parent 77dbcf5a88
commit d04963160b
10 changed files with 63 additions and 76 deletions

View file

@ -27,8 +27,7 @@ DeviceList {
StyledText {
text: qsTr("Settings")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.title.builders.medium.weight(500).build()
}
Item {
@ -39,9 +38,9 @@ DeviceList {
toggled: !root.session.ethernet.active
icon: "settings"
accent: "Primary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
onClicked: {
if (root.session.ethernet.active)
@ -101,7 +100,7 @@ DeviceList {
anchors.centerIn: parent
text: "cable"
font.pointSize: Tokens.font.size.large
font: Tokens.font.icon.large
fill: modelData.connected ? 1 : 0
color: modelData.connected ? Colours.palette.m3onPrimaryContainer : Colours.palette.m3onSurface
@ -130,8 +129,7 @@ DeviceList {
Layout.fillWidth: true
text: modelData.connected ? qsTr("Connected") : qsTr("Disconnected")
color: modelData.connected ? Colours.palette.m3primary : Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font.weight: modelData.connected ? 500 : 400
font: Tokens.font.body.builders.small.weight(modelData.connected ? 500 : 400).build()
elide: Text.ElideRight
}
}

View file

@ -25,8 +25,7 @@ ColumnLayout {
StyledText {
Layout.topMargin: Tokens.spacing.largeIncreased
text: qsTr("Ethernet devices")
font.pointSize: Tokens.font.size.larger
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
StyledText {
@ -58,7 +57,7 @@ ColumnLayout {
StyledText {
text: qsTr("%1").arg(Nmcli.ethernetDevices.length)
color: Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
}
StyledText {
@ -69,7 +68,7 @@ ColumnLayout {
StyledText {
text: qsTr("%1").arg(Nmcli.ethernetDevices.filter(d => d.connected).length)
color: Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
}
}
}

View file

@ -87,8 +87,8 @@ ColumnLayout {
TextButton {
Layout.fillWidth: true
Layout.topMargin: Tokens.spacing.medium
Layout.minimumHeight: Tokens.font.size.normal + Tokens.padding.medium * 2
Layout.topMargin: Tokens.spacing.normal
Layout.minimumHeight: Tokens.font.body.medium.pointSize + Tokens.padding.normal * 2
text: qsTr("⚙ Manage VPN Providers")
inactiveColour: Colours.palette.m3secondaryContainer
inactiveOnColour: Colours.palette.m3onSecondaryContainer

View file

@ -51,8 +51,7 @@ Item {
StyledText {
text: qsTr("Network")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
Item {
@ -63,9 +62,9 @@ Item {
toggled: Nmcli.wifiEnabled
icon: "wifi"
accent: "Tertiary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
tooltip: qsTr("Toggle WiFi")
onClicked: {
@ -77,9 +76,9 @@ Item {
toggled: Nmcli.scanning
icon: "wifi_find"
accent: "Secondary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
tooltip: qsTr("Scan for networks")
onClicked: {
@ -91,9 +90,9 @@ Item {
toggled: !root.session.ethernet.active && !root.session.network.active
icon: "settings"
accent: "Primary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
tooltip: qsTr("Network settings")
onClicked: {

View file

@ -96,7 +96,7 @@ DeviceDetails {
TextButton {
Layout.fillWidth: true
Layout.minimumHeight: Tokens.font.size.normal + Tokens.padding.medium * 2
Layout.minimumHeight: Tokens.font.body.medium.pointSize + Tokens.padding.normal * 2
visible: root.providerEnabled
enabled: !VPN.connecting
inactiveColour: Colours.palette.m3primaryContainer
@ -163,7 +163,7 @@ DeviceDetails {
Layout.topMargin: Tokens.spacing.medium
visible: root.providerEnabled && VPN.status.state === "needs-auth" && VPN.status.authUrl === ""
text: qsTr("Click 'Connect' to generate authentication URL")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
horizontalAlignment: Text.AlignHCenter
wrapMode: Text.WordWrap
@ -320,8 +320,7 @@ DeviceDetails {
StyledText {
text: qsTr("Edit VPN Provider")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
ColumnLayout {
@ -330,7 +329,7 @@ DeviceDetails {
StyledText {
text: qsTr("Display Name")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -367,7 +366,7 @@ DeviceDetails {
StyledText {
text: qsTr("Interface (e.g., wg0, torguard)")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -405,7 +404,7 @@ DeviceDetails {
StyledText {
text: qsTr("Connect Command")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -443,7 +442,7 @@ DeviceDetails {
StyledText {
text: qsTr("Disconnect Command")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}

View file

@ -138,7 +138,7 @@ ColumnLayout {
anchors.centerIn: parent
text: modelData.enabled && VPN.connected ? "vpn_key" : "vpn_key_off"
font.pointSize: Tokens.font.size.large
font: Tokens.font.icon.large
fill: modelData.enabled && VPN.connected ? 1 : 0
color: modelData.enabled && VPN.connected ? Colours.palette.m3onPrimaryContainer : Colours.palette.m3onSurface
}
@ -196,8 +196,7 @@ ColumnLayout {
return Colours.palette.m3tertiary;
return Colours.palette.m3onSurface;
}
font.pointSize: Tokens.font.size.small
font.weight: modelData.enabled && VPN.connected ? 500 : 400
font: Tokens.font.body.builders.small.weight(modelData.enabled && VPN.connected ? 500 : 400).build()
elide: Text.ElideRight
}
}
@ -457,8 +456,7 @@ ColumnLayout {
StyledText {
text: qsTr("Add VPN Provider")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
StyledText {
@ -466,7 +464,7 @@ ColumnLayout {
text: qsTr("Choose a provider to add")
wrapMode: Text.WordWrap
color: Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
}
TextButton {
@ -576,8 +574,7 @@ ColumnLayout {
StyledText {
text: vpnDialog.editIndex >= 0 ? qsTr("Edit VPN Provider") : qsTr("Add %1 VPN").arg(vpnDialog.displayName)
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
ColumnLayout {
@ -586,7 +583,7 @@ ColumnLayout {
StyledText {
text: qsTr("Display Name")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -623,7 +620,7 @@ ColumnLayout {
StyledText {
text: qsTr("Interface (e.g., wg0, torguard)")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -661,7 +658,7 @@ ColumnLayout {
StyledText {
text: qsTr("Connect Command (e.g., wg-quick up wg0)")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}
@ -699,7 +696,7 @@ ColumnLayout {
StyledText {
text: qsTr("Disconnect Command (e.g., wg-quick down wg0)")
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3onSurfaceVariant
}

View file

@ -94,7 +94,7 @@ ColumnLayout {
MaterialIcon {
text: modelData.isActive ? "vpn_key" : "vpn_key_off"
font.pointSize: Tokens.font.size.large
font: Tokens.font.icon.large
color: modelData.isActive ? Colours.palette.m3primary : Colours.palette.m3outline
}
@ -104,12 +104,12 @@ ColumnLayout {
StyledText {
text: modelData.displayName
font.weight: modelData.isActive ? 500 : 400
font: Tokens.font.body.builders.medium.weight(modelData.isActive ? 500 : 400).build()
}
StyledText {
text: qsTr("%1 • %2").arg(modelData.name).arg(modelData.interface || qsTr("No interface"))
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
color: Colours.palette.m3outline
}
}

View file

@ -86,8 +86,8 @@ DeviceDetails {
TextButton {
Layout.fillWidth: true
Layout.topMargin: Tokens.spacing.medium
Layout.minimumHeight: Tokens.font.size.normal + Tokens.padding.medium * 2
Layout.topMargin: Tokens.spacing.normal
Layout.minimumHeight: Tokens.font.body.medium.pointSize + Tokens.padding.normal * 2
visible: {
if (!root.network || !root.network.ssid) {
return false;

View file

@ -34,7 +34,7 @@ DeviceList {
visible: Nmcli.scanning
text: qsTr("Scanning...")
color: Colours.palette.m3primary
font.pointSize: Tokens.font.size.small
font: Tokens.font.title.small
}
}
@ -52,8 +52,7 @@ DeviceList {
StyledText {
text: qsTr("Settings")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.title.builders.medium.weight(500).build()
}
Item {
@ -64,9 +63,9 @@ DeviceList {
toggled: Nmcli.wifiEnabled
icon: "wifi"
accent: "Tertiary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
onClicked: {
Nmcli.toggleWifi(null);
@ -77,9 +76,9 @@ DeviceList {
toggled: Nmcli.scanning
icon: "wifi_find"
accent: "Secondary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
onClicked: {
Nmcli.rescanWifi();
@ -90,9 +89,9 @@ DeviceList {
toggled: !root.session.network.active
icon: "settings"
accent: "Primary"
iconSize: Tokens.font.size.normal
horizontalPadding: Tokens.padding.medium
verticalPadding: Tokens.padding.small
iconSize: Tokens.font.body.medium.pointSize
horizontalPadding: Tokens.padding.normal
verticalPadding: Tokens.padding.smaller
onClicked: {
if (root.session.network.active)
@ -146,7 +145,7 @@ DeviceList {
anchors.centerIn: parent
text: Icons.getNetworkIcon(modelData.strength, modelData.isSecure)
font.pointSize: Tokens.font.size.large
font: Tokens.font.icon.large
fill: modelData.active ? 1 : 0
color: modelData.active ? Colours.palette.m3onPrimaryContainer : Colours.palette.m3onSurface
}
@ -182,8 +181,7 @@ DeviceList {
return qsTr("Open");
}
color: modelData.active ? Colours.palette.m3primary : Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font.weight: modelData.active ? 500 : 400
font: Tokens.font.body.builders.small.weight(modelData.active ? 500 : 400).build()
elide: Text.ElideRight
}
}

View file

@ -149,21 +149,20 @@ Item {
MaterialIcon {
Layout.alignment: Qt.AlignHCenter
text: "lock"
font.pointSize: Tokens.font.size.extraLarge * 2
font: Tokens.font.icon.builders.extraLarge.size(Tokens.font.icon.extraLarge.pointSize * 2).build()
}
StyledText {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Enter password")
font.pointSize: Tokens.font.size.large
font.weight: 500
font: Tokens.font.body.builders.large.weight(500).build()
}
StyledText {
Layout.alignment: Qt.AlignHCenter
text: root.network ? qsTr("Network: %1").arg(root.network.ssid) : ""
color: Colours.palette.m3outline
font.pointSize: Tokens.font.size.small
font: Tokens.font.body.small
}
StyledText {
@ -182,8 +181,7 @@ Item {
return "";
}
color: connectButton.hasError ? Colours.palette.m3error : Colours.palette.m3onSurfaceVariant
font.pointSize: Tokens.font.size.small
font.weight: 400
font: Tokens.font.body.builders.small.weight(400).build()
wrapMode: Text.WordWrap
Layout.maximumWidth: parent.width - Tokens.padding.extraLargeIncreased
}
@ -302,8 +300,7 @@ Item {
anchors.centerIn: parent
text: qsTr("Password")
color: Colours.palette.m3outline
font.pointSize: Tokens.font.size.normal
font.family: Tokens.font.family.mono
font: Tokens.font.mono.medium
opacity: passwordContainer.passwordBuffer ? 0 : 1
Behavior on opacity {
@ -318,7 +315,7 @@ Item {
anchors.centerIn: parent
implicitWidth: fullWidth
implicitHeight: Tokens.font.size.normal
implicitHeight: Tokens.font.body.medium.pointSize
orientation: Qt.Horizontal
spacing: Tokens.spacing.extraSmall
@ -398,7 +395,7 @@ Item {
id: cancelButton
Layout.fillWidth: true
Layout.minimumHeight: Tokens.font.size.normal + Tokens.padding.medium * 2
Layout.minimumHeight: Tokens.font.body.medium.pointSize + Tokens.padding.normal * 2
inactiveColour: Colours.palette.m3secondaryContainer
inactiveOnColour: Colours.palette.m3onSecondaryContainer
text: qsTr("Cancel")
@ -413,7 +410,7 @@ Item {
property bool hasError: false
Layout.fillWidth: true
Layout.minimumHeight: Tokens.font.size.normal + Tokens.padding.medium * 2
Layout.minimumHeight: Tokens.font.body.medium.pointSize + Tokens.padding.normal * 2
inactiveColour: Colours.palette.m3primary
inactiveOnColour: Colours.palette.m3onPrimary
text: qsTr("Connect")