fix(Onboarding): Apply 2 line constraint for create password description text (#12628)

This commit is contained in:
Godfrain Jacques 2023-11-15 07:50:27 -08:00 committed by GitHub
parent 611598ec71
commit 9743fb2537
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 44 additions and 19 deletions

View File

@ -39,12 +39,11 @@ Item {
ColumnLayout { ColumnLayout {
spacing: Style.current.bigPadding spacing: Style.current.bigPadding
anchors.centerIn: parent anchors.centerIn: parent
width: 416
height: 460 height: 460
z: view.zFront z: view.zFront
PasswordView { PasswordView {
id: view id: view
Layout.fillWidth: true Layout.preferredWidth: root.width - 2 * Style.current.bigPadding
Layout.fillHeight: true Layout.fillHeight: true
passwordStrengthScoreFunction: root.startupStore.getPasswordStrengthScore passwordStrengthScoreFunction: root.startupStore.getPasswordStrengthScore
highSizeIntro: true highSizeIntro: true

View File

@ -74,12 +74,13 @@ StatusModal {
fill: parent fill: parent
topMargin: Style.current.padding topMargin: Style.current.padding
bottomMargin: Style.current.padding bottomMargin: Style.current.padding
leftMargin: Style.current.xlPadding leftMargin: Style.current.padding
rightMargin: Style.current.xlPadding rightMargin: Style.current.padding
} }
passwordStrengthScoreFunction: RootStore.getPasswordStrengthScore passwordStrengthScoreFunction: RootStore.getPasswordStrengthScore
titleVisible: false titleVisible: false
introText: qsTr("Change password used to unlock Status on this device & sign transactions.") introText: qsTr("Change password used to unlock Status on this device & sign transactions.")
fixIntroTextWidth: true
createNewPsw: false createNewPsw: false
onReturnPressed: if(submitBtn.enabled) d.submit() onReturnPressed: if(submitBtn.enabled) d.submit()
} }

View File

@ -26,6 +26,7 @@ Item {
Layout.fillHeight: true Layout.fillHeight: true
passwordStrengthScoreFunction: RootStore.getPasswordStrengthScore passwordStrengthScoreFunction: RootStore.getPasswordStrengthScore
highSizeIntro: true highSizeIntro: true
fixIntroTextWidth: true
newPswText: root.sharedKeycardModule.getNewPassword() newPswText: root.sharedKeycardModule.getNewPassword()
confirmationPswText: root.sharedKeycardModule.getNewPassword() confirmationPswText: root.sharedKeycardModule.getNewPassword()

View File

@ -23,6 +23,7 @@ ColumnLayout {
property string recoverText: qsTr("You will not be able to recover this password if it is lost.") property string recoverText: qsTr("You will not be able to recover this password if it is lost.")
property string strengthenText: qsTr("Minimum %n character(s). To strengthen your password consider including:", "", Constants.minPasswordLength) property string strengthenText: qsTr("Minimum %n character(s). To strengthen your password consider including:", "", Constants.minPasswordLength)
property bool highSizeIntro: false property bool highSizeIntro: false
property bool fixIntroTextWidth: false
property var passwordStrengthScoreFunction: function () {} property var passwordStrengthScoreFunction: function () {}
@ -79,6 +80,8 @@ ColumnLayout {
readonly property var validatorRegexp: /^[!-~]{0,64}$/ readonly property var validatorRegexp: /^[!-~]{0,64}$/
readonly property string validatorErrMessage: qsTr("Only letters, numbers, underscores and hyphens allowed") readonly property string validatorErrMessage: qsTr("Only letters, numbers, underscores and hyphens allowed")
readonly property int defaultInputWidth: 416
// Password strength categorization / validation // Password strength categorization / validation
function lowerCaseValidator(text) { return (/[a-z]/.test(text)) } function lowerCaseValidator(text) { return (/[a-z]/.test(text)) }
function upperCaseValidator(text) { return (/[A-Z]/.test(text)) } function upperCaseValidator(text) { return (/[A-Z]/.test(text)) }
@ -153,14 +156,34 @@ ColumnLayout {
color: Theme.palette.directColor1 color: Theme.palette.directColor1
} }
ColumnLayout {
id: introColumn
Layout.preferredWidth: root.fixIntroTextWidth ? d.defaultInputWidth : parent.width
Layout.alignment: Qt.AlignHCenter
spacing: 4
StatusBaseText { StatusBaseText {
id: introTxtField
Layout.fillWidth: true Layout.fillWidth: true
text: "%1 <font color=\"%2\">%3</font>".arg(root.introText).arg(Theme.palette.dangerColor1).arg(root.recoverText) Layout.alignment: Qt.AlignHCenter
font.pixelSize: root.highSizeIntro ? 15 : 12
color: Theme.palette.baseColor1 text: root.introText
horizontalAlignment: Text.AlignHCenter
font.pixelSize: root.highSizeIntro ? Style.current.primaryTextFontSize : Style.current.tertiaryTextFontSize
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
horizontalAlignment: TextEdit.AlignHCenter color: Theme.palette.baseColor1
}
StatusBaseText {
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter
text: root.recoverText
horizontalAlignment: Text.AlignHCenter
font.pixelSize: root.highSizeIntro ? Style.current.primaryTextFontSize : Style.current.tertiaryTextFontSize
wrapMode: Text.WordWrap
color: Theme.palette.dangerColor1
}
} }
StatusPasswordInput { StatusPasswordInput {
@ -171,7 +194,8 @@ ColumnLayout {
z: root.zFront z: root.zFront
visible: !root.createNewPsw visible: !root.createNewPsw
Layout.fillWidth: true Layout.preferredWidth: d.defaultInputWidth
Layout.alignment: Qt.AlignHCenter
placeholderText: qsTr("Current password") placeholderText: qsTr("Current password")
echoMode: showPassword ? TextInput.Normal : TextInput.Password echoMode: showPassword ? TextInput.Normal : TextInput.Password
rightPadding: showHideCurrentIcon.width + showHideCurrentIcon.anchors.rightMargin + Style.current.padding / 2 rightPadding: showHideCurrentIcon.width + showHideCurrentIcon.anchors.rightMargin + Style.current.padding / 2
@ -193,9 +217,9 @@ ColumnLayout {
} }
ColumnLayout { ColumnLayout {
spacing: Style.current.padding / 2 spacing: 4
z: root.zFront z: root.zFront
Layout.fillWidth: true Layout.alignment: Qt.AlignHCenter
StatusPasswordInput { StatusPasswordInput {
id: newPswInput id: newPswInput
@ -203,7 +227,8 @@ ColumnLayout {
property bool showPassword property bool showPassword
Layout.fillWidth: true Layout.preferredWidth: d.defaultInputWidth
Layout.alignment: Qt.AlignHCenter
placeholderText: qsTr("New password") placeholderText: qsTr("New password")
echoMode: showPassword ? TextInput.Normal : TextInput.Password echoMode: showPassword ? TextInput.Normal : TextInput.Password
rightPadding: showHideNewIcon.width + showHideNewIcon.anchors.rightMargin + Style.current.padding / 2 rightPadding: showHideNewIcon.width + showHideNewIcon.anchors.rightMargin + Style.current.padding / 2
@ -244,7 +269,6 @@ ColumnLayout {
StatusPasswordStrengthIndicator { StatusPasswordStrengthIndicator {
id: strengthInditactor id: strengthInditactor
Layout.fillWidth: true
value: Math.min(Constants.minPasswordLength, newPswInput.text.length) value: Math.min(Constants.minPasswordLength, newPswInput.text.length)
from: 0 from: 0
to: Constants.minPasswordLength to: Constants.minPasswordLength
@ -258,7 +282,6 @@ ColumnLayout {
StatusBaseText { StatusBaseText {
id: strengthenTxt id: strengthenTxt
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
text: root.strengthenText text: root.strengthenText
@ -307,7 +330,8 @@ ColumnLayout {
property bool showPassword property bool showPassword
z: root.zFront z: root.zFront
Layout.fillWidth: true Layout.preferredWidth: d.defaultInputWidth
Layout.alignment: Qt.AlignHCenter
placeholderText: qsTr("Confirm password") placeholderText: qsTr("Confirm password")
echoMode: showPassword ? TextInput.Normal : TextInput.Password echoMode: showPassword ? TextInput.Normal : TextInput.Password
rightPadding: showHideConfirmIcon.width + showHideConfirmIcon.anchors.rightMargin + Style.current.padding / 2 rightPadding: showHideConfirmIcon.width + showHideConfirmIcon.anchors.rightMargin + Style.current.padding / 2