QML UI: improve preferences layout

And make it resolution independent.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>

1 files changed, 22 insertions, 25 deletions

diff --git a/qt-mobile/Preferences.qml b/qt-mobile/Preferences.qml
index 9bfb2b307..5f089b496 100644
--- a/qt-mobile/Preferences.qml
+++ b/qt-mobile/Preferences.qml
@@ -16,20 +16,15 @@ Window {
 
 	flags: Qt.Dialog
 	modality: Qt.WindowModal
-	width: 400
-	height: 160
-
-	minimumHeight: 160
-	minimumWidth: 400
-
-	title: "Enter your Subsurface cloud credentials"
-
 	GridLayout {
 		columns: 2
-		anchors.fill: parent
-		anchors.margins: 10
-		rowSpacing: 10
-		columnSpacing: 10
+		anchors.centerIn: parent
+		width: parent.width
+
+		Label {
+			text: "Enter your Subsurface cloud credentials"
+			Layout.columnSpan: 2
+		}
 
 		Label {
 			text: "Email Address:"
@@ -61,19 +56,8 @@ Window {
 		}
 
 		Item {
-			Layout.columnSpan: 2
-			Layout.fillWidth: true
-			implicitHeight: saveButton.height
-
-			Button {
-				id: cancelButton
-				text: "Cancel"
-
-				onClicked: {
-					loginWindow.close();
-				}
-			}
-
+			height: childrenRect.height
+			width: childrenRect.width
 			Button {
 				id: saveButton
 				text: "Save"
@@ -87,5 +71,18 @@ Window {
 				}
 			}
 		}
+
+		Item {
+			height: childrenRect.height
+			width: childrenRect.width
+			Button {
+				id: cancelButton
+				text: "Cancel"
+
+				onClicked: {
+					loginWindow.close();
+				}
+			}
+		}
 	}
 }