feat: initial commit for pixel-snapping components and helpers

Modules/Bar/Popouts/AudioPopout.qml

@@ -5,6 +5,7 @@ import Quickshell.Services.Pipewire
 import Quickshell.Widgets
 import QtQuick
 import QtQuick.Layouts
+import ZShell.Components
 import QtQuick.Controls
 import ZShell.Config
 import qs.Components
@@ -46,7 +47,8 @@ Item {
 		anchors.verticalCenter: parent.verticalCenter
 	}
 
-	component VolumesTab: ColumnLayout {
+	component VolumesTab: SnapLayout {
+orientation: Qt.Vertical
 		spacing: 12
 
 		CustomRect {
@@ -56,14 +58,15 @@ Item {
 			color: Colors.tPalette.m3surfaceContainer
 			radius: root.rounding - vol.anchors.margins
 
-			ColumnLayout {
+			SnapLayout {
+orientation: Qt.Vertical
 				anchors.bottomMargin: Tokens.padding.small
 				anchors.fill: parent
 				anchors.leftMargin: Tokens.padding.small
 				anchors.rightMargin: Tokens.padding.small
 				anchors.topMargin: Tokens.padding.small
 
-				RowLayout {
+				SnapLayout {
 					Layout.fillHeight: true
 					Layout.fillWidth: true
 
@@ -81,7 +84,7 @@ Item {
 					}
 				}
 
-				RowLayout {
+				SnapLayout {
 					spacing: Tokens.spacing.largeIncreased
 
 					CustomMouseArea {
@@ -153,14 +156,15 @@ Item {
 				}
 			}
 
-			ColumnLayout {
+			SnapLayout {
+orientation: Qt.Vertical
 				anchors.bottomMargin: Tokens.padding.small
 				anchors.fill: parent
 				anchors.leftMargin: Tokens.padding.small
 				anchors.rightMargin: Tokens.padding.small
 				anchors.topMargin: Tokens.padding.small
 
-				RowLayout {
+				SnapLayout {
 					Layout.fillHeight: true
 					Layout.fillWidth: true
 
@@ -178,7 +182,7 @@ Item {
 					}
 				}
 
-				RowLayout {
+				SnapLayout {
 					spacing: Tokens.spacing.largeIncreased
 
 					CustomMouseArea {
@@ -276,14 +280,15 @@ Item {
 					text: Audio.getStreamName(appBox.modelData)
 				}
 
-				ColumnLayout {
+				SnapLayout {
+orientation: Qt.Vertical
 					anchors.bottomMargin: Tokens.padding.small
 					anchors.fill: parent
 					anchors.leftMargin: Tokens.padding.small
 					anchors.rightMargin: Tokens.padding.small
 					anchors.topMargin: Tokens.padding.small
 
-					RowLayout {
+					SnapLayout {
 						Layout.fillHeight: true
 						Layout.fillWidth: true
 
@@ -302,7 +307,7 @@ Item {
 						}
 					}
 
-					RowLayout {
+					SnapLayout {
 						spacing: Tokens.spacing.largeIncreased
 
 						CustomMouseArea {