merge from main, settings window wifi updates, component creation, remove known network window

Modules/Settings/Pages/AboutPage.qml

@@ -63,7 +63,7 @@ PageBase {
 				CustomText {
 					Layout.alignment: Qt.AlignHCenter
 					color: Colors.palette.m3onSurfaceVariant
-					font.pointSize: Tokens.font.size.medium
+					font.pointSize: Tokens.font.size.normal
 					text: ZUtils.version ? `v${ZUtils.version}` : "…"
 				}
 			}

Modules/Settings/Pages/Apps/AllApps.qml

@@ -50,7 +50,7 @@ PageBase {
 
 					anchors.fill: parent
 					anchors.leftMargin: Tokens.padding.largeIncreased
-					anchors.margins: Tokens.padding.normal
+					anchors.margins: Tokens.padding.small
 					anchors.rightMargin: Tokens.padding.largeIncreased
 					spacing: Tokens.spacing.small
 
@@ -91,7 +91,7 @@ PageBase {
 
 					MaterialIcon {
 						color: Colors.palette.m3onSurfaceVariant
-						font.pointSize: Tokens.font.size.medium
+						font.pointSize: Tokens.font.size.normal
 						text: "chevron_right"
 					}
 				}

Modules/Settings/Pages/Apps/AppInfo.qml

@@ -40,10 +40,10 @@ PageBase {
 
 		// Header
 		RowLayout {
-			Layout.bottomMargin: Tokens.spacing.large
+			Layout.bottomMargin: Tokens.spacing.largeIncreased
 			Layout.fillWidth: true
-			Layout.leftMargin: Tokens.padding.small
-			spacing: Tokens.spacing.large
+			Layout.leftMargin: Tokens.padding.extraSmall
+			spacing: Tokens.spacing.largeIncreased
 
 			IconImage {
 				asynchronous: true
@@ -57,7 +57,7 @@ PageBase {
 
 				CustomText {
 					Layout.fillWidth: true
-					font.pointSize: Tokens.font.size.medium
+					font.pointSize: Tokens.font.size.normal
 					text: root.app?.name ?? ""
 					wrapMode: Text.WordWrap
 				}
@@ -144,7 +144,7 @@ PageBase {
 
 			anchors.fill: parent
 			anchors.leftMargin: Tokens.padding.largeIncreased
-			anchors.margins: Tokens.padding.normal
+			anchors.margins: Tokens.padding.small
 			anchors.rightMargin: Tokens.padding.largeIncreased
 			spacing: Tokens.spacing.small
 

Modules/Settings/Pages/AppsPage.qml

@@ -138,7 +138,7 @@ PageBase {
 						id: itemLayout
 
 						anchors.fill: parent
-						anchors.margins: Tokens.padding.normal
+						anchors.margins: Tokens.padding.small
 						spacing: Tokens.spacing.small
 
 						IconImage {

Modules/Settings/Pages/Audio/AppVolumes.qml

@@ -26,7 +26,7 @@ PageBase {
 		CustomText {
 			Layout.bottomMargin: Tokens.spacing.small
 			Layout.fillWidth: true
-			Layout.leftMargin: Tokens.padding.small
+			Layout.leftMargin: Tokens.padding.extraSmall
 			color: Colors.palette.m3outline
 			font.pointSize: Tokens.font.size.small
 			text: qsTr("Adjust the volume of individual apps currently playing audio.")

Modules/Settings/Pages/AudioPage.qml

@@ -52,7 +52,7 @@ PageBase {
 
 		// Input
 		SliderRow {
-			Layout.topMargin: Tokens.spacing.large - parent.spacing
+			Layout.topMargin: Tokens.spacing.largeIncreased - parent.spacing
 			enabled: !Audio.sourceMuted
 			first: true
 			icon: Icons.getMicVolumeIcon(Audio.sourceVolume, Audio.sourceMuted)
@@ -84,7 +84,7 @@ PageBase {
 		// Per-app volumes
 		ConnectedRect {
 			Layout.fillWidth: true
-			Layout.topMargin: Tokens.spacing.large - parent.spacing
+			Layout.topMargin: Tokens.spacing.largeIncreased - parent.spacing
 			first: true
 			implicitHeight: appLayout.implicitHeight + appLayout.anchors.margins * 2
 			last: true
@@ -98,12 +98,12 @@ PageBase {
 
 				anchors.fill: parent
 				anchors.leftMargin: Tokens.padding.largeIncreased
-				anchors.margins: Tokens.padding.normal
+				anchors.margins: Tokens.padding.small
 				anchors.rightMargin: Tokens.padding.largeIncreased
 				spacing: Tokens.spacing.small
 
 				MaterialIcon {
-					font.pointSize: Tokens.font.size.medium
+					font.pointSize: Tokens.font.size.normal
 					text: "tune"
 				}
 
@@ -130,7 +130,7 @@ PageBase {
 
 				MaterialIcon {
 					color: Colors.palette.m3onSurfaceVariant
-					font.pointSize: Tokens.font.size.medium
+					font.pointSize: Tokens.font.size.normal
 					text: "chevron_right"
 				}
 			}

Modules/Settings/Pages/NetworkPage.qml

@@ -15,6 +15,9 @@ PageBase {
 
 	title: qsTr("Network")
 
+	Component.onCompleted: Network.active = true
+	Component.onDestruction: Network.active = false
+
 	ColumnLayout {
 		id: networkContent
 
@@ -60,6 +63,13 @@ PageBase {
 					}
 				}
 
+				DelegateChoice {
+					roleValue: false
+
+					delegate: KnownNetworkManager {
+					}
+				}
+
 				DelegateChoice {
 					delegate: NetworkItem {
 						list: rows
@@ -85,7 +95,11 @@ PageBase {
 									isDivider: true,
 									type: "known"
 								},
-								...kNetworks.sort(byStrengthName)] : []), ...(uNetworks.length > 0 ? [
+								...kNetworks.sort(byStrengthName),
+								{
+									isDivider: false
+								}
+							] : []), ...(uNetworks.length > 0 ? [
 								{
 									isDivider: true,
 									type: "unknown"
@@ -118,28 +132,33 @@ PageBase {
 			}
 		}
 
-		KNetworkList {
-			acceptLabel: qsTr("Remove")
-			enabled: Object.keys(model).length > 0
-			header: qsTr("Manage known networks")
-			icon: "Network_Manage"
-			label: qsTr("Show all known networks")
-			model: Network.networks.filter(n => n.known && !n.connected).map(n => ({
-						id: n.id,
-						label: n.name
-					}))
-			rootParent: root.flickable
-
-			onAccepted: {
-				if (!selectedItem)
-					return;
-
-				Network.forgetNetworks(Network.networks.find(n => n.id === selectedItem));
-			}
+		NetworkOverlay {
+			anchors.centerIn: parent
 		}
 	}
 
-	component KNetworkList: DialogRowButton {
+	component KnownNetworkManager: NetworkSelect {
+		acceptLabel: qsTr("Remove")
+		enabled: Object.keys(model).length > 0
+		header: qsTr("Manage known networks")
+		icon: "Network_Manage"
+		label: qsTr("Manage known networks")
+		model: Network.networks.filter(n => n.known && !n.connected).map(n => ({
+					id: n.name,
+					label: n.name
+				}))
+		rootParent: root.flickable
+		width: rows.width
+
+		onAccepted: {
+			if (!selectedItem)
+				return;
+
+			const networkToForget = Network.networks.find(n => n.name === selectedItem);
+			Network.forgetNetwork(networkToForget);
+		}
+	}
+	component NetworkSelect: DialogRowButton {
 		id: klist
 
 		required property var model
@@ -154,7 +173,7 @@ PageBase {
 		}
 
 		acceptAllowed: !!selectedItem
-		horizontalContentMargin: -Tokens.padding.small
+		horizontalContentMargin: -Tokens.padding.extraSmall
 		separateContent: true
 
 		content: Component {
@@ -174,8 +193,8 @@ PageBase {
 					anchors.margins: 1 // Gets cut off for some reason without this
 					anchors.right: ListView.view.contentItem.right
 					color: Qt.alpha(Colors.palette.m3tertiaryContainer, selected ? 1 : 0)
-					implicitHeight: label.implicitHeight + Tokens.padding.normal * 2
-					radius: stateLayer.pressed ? Tokens.rounding.extraSmall : selected ? Tokens.rounding.large : Tokens.rounding.normal
+					implicitHeight: label.implicitHeight + Tokens.padding.small * 2
+					radius: stateLayer.pressed ? Tokens.rounding.extraSmall : selected ? Tokens.rounding.largeIncreased : Tokens.rounding.medium
 
 					Behavior on radius {
 						Anim {
@@ -195,7 +214,7 @@ PageBase {
 						anchors.left: parent.left
 						anchors.margins: Tokens.padding.large
 						anchors.right: item.selected ? checkIcon.left : parent.right
-						anchors.rightMargin: item.selected ? Tokens.spacing.normal : anchors.margins
+						anchors.rightMargin: item.selected ? Tokens.spacing.medium : anchors.margins
 						anchors.verticalCenter: parent.verticalCenter
 						color: item.selected ? Colors.palette.m3onTertiaryContainer : Colors.palette.m3onSurface
 						elide: Text.ElideRight
@@ -210,7 +229,7 @@ PageBase {
 						anchors.right: parent.right
 						anchors.verticalCenter: parent.verticalCenter
 						color: Colors.palette.m3onTertiaryContainer
-						font.pointSize: Tokens.font.size.medium
+						font.pointSize: Tokens.font.size.normal
 						opacity: item.selected ? 1 : 0
 						text: "check"
 

Modules/Settings/Pages/Panels/SidebarPanel.qml

@@ -9,6 +9,16 @@ import qs.Modules.Settings.Common
 PageBase {
 	id: root
 
+	readonly property var builtinIcons: ({
+			audio: qsTr("Toggle audio"),
+			mic: qsTr("Toggle microphone"),
+			settings: qsTr("Open settings"),
+			dnd: qsTr("Toggle Do-Not-Disturb"),
+			gameMode: qsTr("Toggle game mode"),
+			bluetooth: qsTr("Toggle bluetooth"),
+			wifi: qsTr("Toggle Wi-Fi")
+		})
+
 	isSubPage: true
 	title: qsTr("Sidebar")
 
@@ -44,5 +54,59 @@ PageBase {
 
 			onMoved: v => Config.sidebar.dragThreshold = v
 		}
+
+		SectionHeader {
+			text: qsTr("Quick toggles")
+		}
+
+		ListEditor {
+			function labelFor(item: var): string {
+				const prettyName = root.builtinIcons[item.id];
+				if (prettyName)
+					return prettyName;
+				const label = item.id.replace(/([A-Z])/g, " $1");
+				return label.charAt(0).toUpperCase() + label.slice(1).toLowerCase();
+			}
+
+			function toggledFor(item: var): bool {
+				return item.enabled;
+			}
+
+			first: true
+			values: Config.utilities.quickToggles.values
+			z: 1
+
+			onItemMoved: (from, to) => Config.utilities.quickToggles.move(from, to)
+			onItemRemoved: index => Config.utilities.quickToggles.remove(index)
+			onItemToggled: (index, checked) => Config.utilities.quickToggles.at(index).enabled = checked
+		}
+
+		DialogSelectButton {
+			id: addItemContainer
+
+			acceptLabel: qsTr("Add")
+			enabled: Object.keys(model).length > 0
+			header: qsTr("Add new entry")
+			icon: "add"
+			label: qsTr("Add entry")
+			model: {
+				const present = new Set(Config.utilities.quickToggles.values.map(item => item.id));
+				return Object.keys(root.builtinIcons).filter(id => !present.has(id)).map(id => ({
+							id: id,
+							label: root.builtinIcons[id]
+						}));
+			}
+			rootParent: root.flickable
+
+			onAccepted: {
+				if (!selectedItem)
+					return;
+
+				Config.utilities.quickToggles.insert({
+					id: selectedItem,
+					enabled: true
+				});
+			}
+		}
 	}
 }

Modules/Settings/Pages/Wallpaper/WallpaperSelect.qml

@@ -24,7 +24,7 @@ PageBase {
 		width: root.cappedWidth
 
 		CustomText {
-			Layout.topMargin: Tokens.spacing.large
+			Layout.topMargin: Tokens.spacing.largeIncreased
 			font.pointSize: Tokens.font.size.large
 			text: qsTr("Wallpapers")
 		}
@@ -73,7 +73,7 @@ PageBase {
 			sourceComponent: CustomRect {
 				color: Colors.tPalette.m3surfaceContainer
 				implicitHeight: noWallsLayout.implicitHeight + Tokens.padding.extraLarge * 3
-				radius: Tokens.rounding.large
+				radius: Tokens.rounding.largeIncreased
 
 				ColumnLayout {
 					id: noWallsLayout

Modules/Settings/Pages/WallpaperPage.qml

@@ -18,7 +18,7 @@ PageBase {
 	ColumnLayout {
 		anchors.horizontalCenter: parent.horizontalCenter
 		anchors.top: parent.top
-		spacing: Tokens.spacing.large
+		spacing: Tokens.spacing.largeIncreased
 		width: root.cappedWidth
 
 		Item {
@@ -42,7 +42,7 @@ PageBase {
 			shapeMorph: true
 			text: qsTr("Wallpapers")
 			type: IconTextButton.Tonal
-			verticalPadding: Tokens.padding.normal
+			verticalPadding: Tokens.padding.small
 
 			onClicked: root.sState.openSubPage(1) // Wallpaper page
 		}