fix settings background desync

Drawers/Panels.qml

@@ -34,6 +34,7 @@ Item {
 	readonly property alias resourcesWrapper: resourcesWrapper
 	required property ShellScreen screen
 	readonly property alias settings: settings
+	readonly property alias settingsWrapper: settingsWrapper
 	readonly property alias sidebar: sidebar
 	readonly property alias toasts: toasts
 	readonly property alias utilities: utilities
@@ -176,6 +177,15 @@ Item {
 		visibilities: root.visibilities
 	}
 
+	Item {
+		id: settingsWrapper
+
+		anchors.horizontalCenter: parent.horizontalCenter
+		anchors.top: parent.top
+		clip: true
+		implicitHeight: settings.implicitHeight * (1 - settings.offsetScale)
+		implicitWidth: settings.implicitWidth
+
 		Settings.Wrapper {
 			id: settings
 
@@ -186,6 +196,7 @@ Item {
 			screen: root.screen
 			visibilities: root.visibilities
 		}
+	}
 
 	Dock.Wrapper {
 		id: dock

Drawers/Windows.qml

@@ -272,6 +272,8 @@ Variants {
 					radius: Appearance.rounding.large
 					topLeftRadius: Appearance.rounding.large + Appearance.padding.smaller
 					topRightRadius: Appearance.rounding.large + Appearance.padding.smaller
+					x: panels.settingsWrapper.x + panels.settings.x + Config.barConfig.border
+					y: panels.settingsWrapper.y + panels.settings.y + bar.implicitHeight
 				}
 
 				PanelBg {

Modules/Settings/Wrapper.qml

@@ -7,45 +7,56 @@ import qs.Helpers
 Item {
 	id: root
 
+	property real offsetScale: shouldBeActive ? 0 : 1
 	required property var panels
 	required property ShellScreen screen
+	readonly property bool shouldBeActive: visibilities.settings
 	required property PersistentProperties visibilities
 
-	implicitHeight: 0
+	anchors.topMargin: (-implicitHeight - 5) * offsetScale
+	implicitHeight: content.implicitHeight
 	implicitWidth: content.implicitWidth
-	visible: height > 0
+	opacity: 1 - offsetScale
-
+	visible: offsetScale < 1
-	states: State {
-		name: "visible"
-		when: root.visibilities.settings
-
-		PropertyChanges {
-			root.implicitHeight: content.implicitHeight
-		}
-	}
-	transitions: [
-		Transition {
-			from: ""
-			to: "visible"
 
+	Behavior on offsetScale {
 		Anim {
-				duration: MaterialEasing.expressiveEffectsTime
+			duration: Appearance.anim.durations.expressiveDefaultSpatial
-				easing.bezierCurve: MaterialEasing.expressiveEffects
+			easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
-				property: "implicitHeight"
+		}
-				target: root
 	}
-		},
-		Transition {
-			from: "visible"
-			to: ""
 
-			Anim {
+	// states: State {
-				easing.bezierCurve: MaterialEasing.expressiveEffects
+	// 	name: "visible"
-				property: "implicitHeight"
+	// 	when: root.visibilities.settings
-				target: root
+	//
-			}
+	// 	PropertyChanges {
-		}
+	// 		root.implicitHeight: content.implicitHeight
-	]
+	// 	}
+	// }
+	// transitions: [
+	// 	Transition {
+	// 		from: ""
+	// 		to: "visible"
+	//
+	// 		Anim {
+	// 			duration: MaterialEasing.expressiveEffectsTime
+	// 			easing.bezierCurve: MaterialEasing.expressiveEffects
+	// 			property: "implicitHeight"
+	// 			target: root
+	// 		}
+	// 	},
+	// 	Transition {
+	// 		from: "visible"
+	// 		to: ""
+	//
+	// 		Anim {
+	// 			easing.bezierCurve: MaterialEasing.expressiveEffects
+	// 			property: "implicitHeight"
+	// 			target: root
+	// 		}
+	// 	}
+	// ]
 
 	CustomClippingRect {
 		anchors.fill: parent