Improve layout of login dialog

- Add margins consistent with other pages
- Top-align the dialog, we want to keep the inputs as high as possible
  on the screen to prevent the on-screen-keyboard from covering them
- Add a checkbox to show the password, with input on mobile devices,
  this is a commonly found and useful feature
- Remove Cancel button, this is just navigation chrome, the user can
  simply use the back button in the top bar (will be fixed in a
  subsequent patch)

Signed-off-by: Sebastian Kügler <sebas@kde.org>
Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Sebastian Kügler 2015-11-07 03:01:16 +01:00 committed by Dirk Hohndel
parent aae4a326f4
commit 6dfac6a081

View file

@ -16,11 +16,13 @@ Item {
GridLayout {
columns: 2
anchors.centerIn: parent
width: parent.width
anchors.fill: parent
anchors.margins: units.gridUnit
Label {
text: "Enter your Subsurface cloud credentials"
Layout.bottomMargin: units.largeSpacing
font.pointSize: units.titlePointSize
Layout.columnSpan: 2
}
@ -45,6 +47,18 @@ Item {
Layout.fillWidth: true
}
Label {
text: "Show password"
}
CheckBox {
checked: false
id: showPassword
onCheckedChanged: {
password.echoMode = checked ? TextInput.Normal : TextInput.Password
}
}
Label {
text: "Save Password locally"
}
@ -54,6 +68,7 @@ Item {
id: savePassword
}
Item { width: units.gridUnit; height: width }
Item {
height: saveButton.height
width: saveButton.width
@ -72,16 +87,7 @@ Item {
}
Item {
height: cancelButton.height
width: cancelButton.width
Button {
id: cancelButton
text: "Cancel"
onClicked: {
stackView.pop();
}
}
Layout.fillHeight: true
}
}
}