Harden display apply and recovery

config/dot/quickshell/modules/settings/SettingsPage.qml

@@ -28,11 +28,31 @@ Item {
     // scrolls -- the Appearance page pins its live preview here.
     property Component header: null
 
+    Loader {
+        id: pinnedHeader
+
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.leftMargin: 34
+        anchors.rightMargin: 34
+        anchors.topMargin: 30
+        active: root.header !== null
+        sourceComponent: root.header
+        z: 1
+    }
+
     Flickable {
-        anchors.fill: parent
+        id: pageScroll
+
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: pinnedHeader.active ? pinnedHeader.bottom : parent.top
+        anchors.bottom: parent.bottom
+        anchors.topMargin: pinnedHeader.active ? 16 : 0
         clip: true
         contentWidth: width
-        contentHeight: layout.implicitHeight + 64
+        contentHeight: layout.implicitHeight + (pinnedHeader.active ? 34 : 64)
         boundsBehavior: Flickable.StopAtBounds
 
         Column {
@@ -40,15 +60,9 @@ Item {
 
             width: parent.width - 68
             x: 34
-            y: 30
+            y: pinnedHeader.active ? 0 : 30
             spacing: 16
 
-            Loader {
-                width: parent.width
-                active: root.header !== null
-                sourceComponent: root.header
-            }
-
             Text {
                 width: parent.width
                 visible: root.title !== ""