Move header definition from EditAccount to HPage

TODO.md

@@ -1,4 +1,5 @@
 - Way to round avatar corners to allow box radius
+- Devices and client settings in edit account page
 - If avatar is set, name color from average color?
 - Wrong avatar for group rooms
 - Reduce messages ListView cacheBuffer height once http thumbnails

src/qml/Base/HPage.qml

@@ -11,6 +11,9 @@ SwipeView {
     property alias page: innerPage
     property alias flickable: innerFlickable
 
+    property alias headerLabel: innerHeaderLabel
+    property var hideHeaderUnderHeight: null
+
     property bool wide: width > 414 + leftPadding + rightPadding
 
     property int currentSpacing:
@@ -32,6 +35,41 @@ SwipeView {
         id: innerPage
         background: null
 
+        header: HRectangle {
+            width: parent.width
+            implicitWidth: parent.width
+            color: theme.pageHeadersBackground
+
+            height: ! hideHeaderUnderHeight ||
+                    window.height >=
+                    hideHeaderUnderHeight +
+                    theme.baseElementsHeight +
+                    currentSpacing * 2 ?
+                    theme.baseElementsHeight : 0
+
+            Behavior on height { HNumberAnimation {} }
+            visible: height > 0
+
+            HRowLayout {
+                width: parent.width
+
+                HLabel {
+                    id: innerHeaderLabel
+                    text: qsTr("Account settings for %1").arg(
+                        Utils.coloredNameHtml(userInfo.displayName, userId)
+                    )
+                    textFormat: Text.StyledText
+                    font.pixelSize: theme.fontSize.big
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignHCenter
+
+                    Layout.leftMargin: currentSpacing
+                    Layout.rightMargin: Layout.leftMargin
+                    Layout.fillWidth: true
+                }
+            }
+        }
+
         leftPadding: currentSpacing < theme.spacing ? 0 : currentSpacing
         rightPadding: leftPadding
         Behavior on leftPadding { HNumberAnimation {} }

src/qml/Pages/EditAccount/EditAccount.qml

@@ -15,37 +15,9 @@ HPage {
     property string userId: ""
     readonly property var userInfo: users.find(userId)
 
-    page.header: HRectangle {
+    hideHeaderUnderHeight: avatarPreferredSize
-        width: parent.width
+    headerLabel.text: qsTr("Account settings for %1")
-        color: theme.pageHeadersBackground
+                      .arg(Utils.coloredNameHtml(userInfo.displayName, userId))
-
-        height: window.height <
-                avatarPreferredSize +
-                theme.baseElementsHeight +
-                currentSpacing * 2 ?
-                0 : theme.baseElementsHeight
-
-        Behavior on height { HNumberAnimation {} }
-        visible: height > 0
-
-        HRowLayout {
-            width: parent.width
-
-            HLabel {
-                text: qsTr("Account settings for %1").arg(
-                    Utils.coloredNameHtml(userInfo.displayName, userId)
-                )
-                textFormat: Text.StyledText
-                font.pixelSize: theme.fontSize.big
-                elide: Text.ElideRight
-                horizontalAlignment: Text.AlignHCenter
-
-                Layout.leftMargin: currentSpacing
-                Layout.rightMargin: Layout.leftMargin
-                Layout.fillWidth: true
-            }
-        }
-    }
 
     HRectangle {
         color: theme.box.background

src/qml/UI.qml

@@ -44,6 +44,7 @@ Item {
             Layout.minimumWidth: reduce ? 0 : theme.sidePane.collapsedWidth
 
             Behavior on Layout.minimumWidth {
+                // Must run faster than SidePane implicitWidth anim
                 HNumberAnimation { duration: theme.animationDuration / 2 }
             }
         }