diff --git a/Assets/Translations/en.json b/Assets/Translations/en.json index 0af2ba5750..09d61a21b9 100644 --- a/Assets/Translations/en.json +++ b/Assets/Translations/en.json @@ -443,6 +443,7 @@ "general": "General", "height": "Height", "hibernate": "Hibernate", + "hide-password": "Hide password", "history": "History", "icon": "Icon", "idle": "Idle", @@ -518,6 +519,7 @@ "settings": "Settings", "shortcuts": "Shortcuts", "shutdown": "Shutdown", + "show-password": "Show password", "signal": "Signal", "sound": "Sound", "sources": "Sources", diff --git a/Widgets/NTextInput.qml b/Widgets/NTextInput.qml index 66fef69a0f..ac101e8bf4 100644 --- a/Widgets/NTextInput.qml +++ b/Widgets/NTextInput.qml @@ -21,6 +21,9 @@ ColumnLayout { property real radius: Style.iRadiusM property real minimumInputWidth: 80 * Style.uiScaleRatio property bool showClearButton: true + property bool passwordMode: false + property bool passwordVisible: false + property bool showPasswordToggle: false property alias text: input.text property alias placeholderText: input.placeholderText @@ -149,7 +152,7 @@ ColumnLayout { verticalAlignment: TextInput.AlignVCenter - echoMode: TextInput.Normal + echoMode: root.passwordMode && !root.passwordVisible ? TextInput.Password : TextInput.Normal readOnly: root.readOnly placeholderTextColor: Qt.alpha(Color.mOnSurfaceVariant, 0.6) color: enabled ? Color.mOnSurface : Qt.alpha(Color.mOnSurface, 0.4) @@ -231,6 +234,27 @@ ColumnLayout { input.forceActiveFocus(); } } + + NIconButton { + id: passwordToggle + icon: root.passwordVisible ? "eye-off" : "eye" + tooltipText: (!root.readOnly && root.enabled) ? (root.passwordVisible ? I18n.tr("common.hide-password") : I18n.tr("common.show-password")) : "" + + Layout.alignment: Qt.AlignVCenter + border.width: 0 + + colorBg: "transparent" + colorBgHover: "transparent" + colorFg: Color.mOnSurface + colorFgHover: Color.mError + visible: root.passwordMode && root.showPasswordToggle + enabled: !root.readOnly && root.enabled + + onClicked: { + root.passwordVisible = !root.passwordVisible; + input.forceActiveFocus(); + } + } } } }