mirror of
https://github.com/monero-project/monero-gui.git
synced 2024-11-16 15:58:11 +00:00
WizardAskPassword: add colors to password strength meter; add "Passwords match/do not match" message
This commit is contained in:
rating89us
parent
113efbfdf0
commit
b99b333b71
2 changed files with 99 additions and 52 deletions
|
|
@ -35,6 +35,7 @@ Object {
|
||||||
property string arrowLeft : "\uf060"
|
property string arrowLeft : "\uf060"
|
||||||
property string arrowRight : "\uf061"
|
property string arrowRight : "\uf061"
|
||||||
property string cashRegister: "\uf788"
|
property string cashRegister: "\uf788"
|
||||||
|
property string checkCircle: "\uf058"
|
||||||
property string clipboard : "\uf0ea"
|
property string clipboard : "\uf0ea"
|
||||||
property string clockO : "\uf017"
|
property string clockO : "\uf017"
|
||||||
property string cloud : "\uf0c2"
|
property string cloud : "\uf0c2"
|
||||||
|
|
|
||||||
|
|
@ -70,10 +70,13 @@ ColumnLayout {
|
||||||
var strengthString;
|
var strengthString;
|
||||||
if(strength <= 33){
|
if(strength <= 33){
|
||||||
strengthString = qsTr("Low");
|
strengthString = qsTr("Low");
|
||||||
|
fillRect.color = "#FF0000";
|
||||||
} else if(strength <= 66){
|
} else if(strength <= 66){
|
||||||
strengthString = qsTr("Medium");
|
strengthString = qsTr("Medium");
|
||||||
|
fillRect.color = (MoneroComponents.Style.blackTheme ? "#FFFF00" : "#FFCC00");
|
||||||
} else {
|
} else {
|
||||||
strengthString = qsTr("High");
|
strengthString = qsTr("High");
|
||||||
|
fillRect.color = (MoneroComponents.Style.blackTheme ? "#00FF00" : "#008000");
|
||||||
}
|
}
|
||||||
|
|
||||||
progressText.text = passwordStrengthText + strengthString + translationManager.emptyString;
|
progressText.text = passwordStrengthText + strengthString + translationManager.emptyString;
|
||||||
|
|
@ -91,74 +94,117 @@ ColumnLayout {
|
||||||
}
|
}
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
id: progressLayout
|
|
||||||
spacing: 0
|
|
||||||
visible: !isAndroid && walletManager.getPasswordStrength !== undefined
|
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
|
|
||||||
TextInput {
|
MoneroComponents.LineEdit {
|
||||||
id: progressText
|
id: passwordInput
|
||||||
Layout.topMargin: 6
|
|
||||||
Layout.bottomMargin: 6
|
|
||||||
font.family: MoneroComponents.Style.fontMedium.name
|
|
||||||
font.pixelSize: 14
|
|
||||||
font.bold: false
|
|
||||||
color: MoneroComponents.Style.defaultFontColor
|
|
||||||
height: 18
|
|
||||||
passwordCharacter: "*"
|
|
||||||
}
|
|
||||||
|
|
||||||
Rectangle {
|
|
||||||
id: bar
|
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.preferredHeight: 8
|
KeyNavigation.tab: passwordInputConfirm
|
||||||
|
labelFontSize: 14
|
||||||
|
password: true
|
||||||
|
labelText: qsTr("Password") + translationManager.emptyString
|
||||||
|
text: walletOptionsPassword
|
||||||
|
}
|
||||||
|
|
||||||
radius: 8
|
ColumnLayout {
|
||||||
color: MoneroComponents.Style.progressBarBackgroundColor
|
id: progressLayout
|
||||||
|
spacing: 0
|
||||||
|
visible: !isAndroid && walletManager.getPasswordStrength !== undefined
|
||||||
|
Layout.fillWidth: true
|
||||||
|
Layout.topMargin: 0
|
||||||
|
|
||||||
Rectangle {
|
TextInput {
|
||||||
id: fillRect
|
id: progressText
|
||||||
anchors.top: parent.top
|
Layout.topMargin: 6
|
||||||
anchors.bottom: parent.bottom
|
Layout.bottomMargin: 6
|
||||||
anchors.left: parent.left
|
font.family: MoneroComponents.Style.fontMedium.name
|
||||||
height: bar.height
|
font.pixelSize: 14
|
||||||
property int maxWidth: bar.width
|
font.bold: false
|
||||||
width: (maxWidth * root.passwordFill) / 100
|
color: MoneroComponents.Style.defaultFontColor
|
||||||
radius: 8
|
height: 18
|
||||||
color: MoneroComponents.Style.orange
|
passwordCharacter: "*"
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
color: MoneroComponents.Style.defaultFontColor
|
id: bar
|
||||||
anchors.bottom: parent.bottom
|
Layout.fillWidth: true
|
||||||
anchors.left: parent.left
|
Layout.preferredHeight: 8
|
||||||
anchors.leftMargin: 8
|
|
||||||
|
radius: 8
|
||||||
|
color: MoneroComponents.Style.progressBarBackgroundColor
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
id: fillRect
|
||||||
|
anchors.top: parent.top
|
||||||
|
anchors.bottom: parent.bottom
|
||||||
|
anchors.left: parent.left
|
||||||
|
height: bar.height
|
||||||
|
property int maxWidth: bar.width
|
||||||
|
width: (maxWidth * root.passwordFill) / 100
|
||||||
|
radius: 8
|
||||||
|
color: "#FF0000"
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
color: MoneroComponents.Style.defaultFontColor
|
||||||
|
anchors.bottom: parent.bottom
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.leftMargin: 8
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
MoneroComponents.LineEdit {
|
ColumnLayout {
|
||||||
id: passwordInput
|
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
KeyNavigation.tab: passwordInputConfirm
|
|
||||||
|
|
||||||
labelFontSize: 14
|
MoneroComponents.LineEdit {
|
||||||
password: true
|
id: passwordInputConfirm
|
||||||
|
property bool firstUserInput: true
|
||||||
|
Layout.fillWidth: true
|
||||||
|
Layout.topMargin: 8
|
||||||
|
KeyNavigation.tab: passwordInputConfirm
|
||||||
|
error: !passwordInputMessage.passwordsMatch && passwordInputMessage.visible
|
||||||
|
errorWhenEmpty: passwordInputMessage.passwordsMatch && passwordInputMessage.visible
|
||||||
|
labelFontSize: 14
|
||||||
|
passwordLinked: passwordInput
|
||||||
|
labelText: qsTr("Password (confirm)") + translationManager.emptyString
|
||||||
|
text: walletOptionsPassword
|
||||||
|
onTextChanged:{
|
||||||
|
if (passwordInputConfirm.text.length == passwordInput.text.length) {
|
||||||
|
firstUserInput = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
labelText: qsTr("Password") + translationManager.emptyString
|
RowLayout {
|
||||||
text: walletOptionsPassword
|
Layout.fillWidth: true
|
||||||
}
|
Layout.topMargin: 0
|
||||||
|
Layout.minimumHeight: passwordInputMessage.height + 3
|
||||||
|
|
||||||
MoneroComponents.LineEdit {
|
MoneroComponents.TextPlain {
|
||||||
id: passwordInputConfirm
|
visible: passwordInputMessage.visible
|
||||||
Layout.fillWidth: true
|
font.family: FontAwesome.fontFamilySolid
|
||||||
Layout.topMargin: 8
|
font.styleName: "Solid"
|
||||||
KeyNavigation.tab: passwordInputConfirm
|
font.pixelSize: 15
|
||||||
|
text: passwordInputMessage.passwordsMatch ? FontAwesome.checkCircle : FontAwesome.exclamationCircle
|
||||||
|
color: passwordInputMessage.color
|
||||||
|
themeTransition: false
|
||||||
|
}
|
||||||
|
|
||||||
labelFontSize: 14
|
MoneroComponents.TextPlain {
|
||||||
passwordLinked: passwordInput
|
id: passwordInputMessage
|
||||||
|
property bool passwordsMatch: passwordInputConfirm.text === passwordInput.text
|
||||||
labelText: qsTr("Password (confirm)") + translationManager.emptyString
|
property bool partialPasswordsMatch: passwordInputConfirm.text === passwordInput.text.substring(0, passwordInputConfirm.text.length)
|
||||||
text: walletOptionsPassword
|
visible: passwordInputConfirm.text.length > 0 && !passwordInputConfirm.firstUserInput || passwordInputConfirm.firstUserInput && !passwordInputMessage.partialPasswordsMatch
|
||||||
|
Layout.topMargin: 3
|
||||||
|
text: passwordsMatch ? qsTr("Passwords match!") : qsTr("Passwords do not match") + translationManager.emptyString
|
||||||
|
textFormat: Text.PlainText
|
||||||
|
color: passwordsMatch ? (MoneroComponents.Style.blackTheme ? "#00FF00" : "#008000") : "#FF0000"
|
||||||
|
font.family: MoneroComponents.Style.fontRegular.name
|
||||||
|
font.pixelSize: 14
|
||||||
|
themeTransition: false
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue