Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add show/hide button to password fields #1861

Merged
merged 8 commits into from
Jul 14, 2023
Merged

Conversation

SleeplessOne1917
Copy link
Member

@SleeplessOne1917 SleeplessOne1917 commented Jul 7, 2023

Description

Gives the user the ability to toggle the visibility of their password when using password input fields.

Screencast_20230707_191946.webm

Screenshots

With forgot password link

image

With password strengthometer

image

I also tweaked some parts of the settings page.

Before

image
image

After

image
image

src/shared/components/common/password-input.tsx Outdated Show resolved Hide resolved
type="button"
id={id}
onClick={linkEvent(this, handleToggleShow)}
aria-label={show ? "Hide Password" : "Show Password"}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Needs i18n

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some of the strings in this file still need fixed.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Which ones?

src/shared/components/home/login.tsx Outdated Show resolved Hide resolved
src/shared/components/home/setup.tsx Outdated Show resolved Hide resolved
src/shared/components/home/signup.tsx Outdated Show resolved Hide resolved
src/shared/components/home/signup.tsx Outdated Show resolved Hide resolved
src/shared/components/person/password-change.tsx Outdated Show resolved Hide resolved
src/shared/components/person/password-change.tsx Outdated Show resolved Hide resolved
src/shared/components/person/settings.tsx Outdated Show resolved Hide resolved
Copy link
Member

@dessalines dessalines left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok translations are merged now.

type="button"
id={id}
onClick={linkEvent(this, handleToggleShow)}
aria-label={show ? "Hide Password" : "Show Password"}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some of the strings in this file still need fixed.

@dessalines dessalines merged commit b7ec7ae into main Jul 14, 2023
dessalines pushed a commit that referenced this pull request Jul 21, 2023
* Make working password inputs

* Make show/hide password button use icon

* Tweak look

* Handle delete account form separately from change settings form

* Adjust password strengthometer position

* Incorporate PR feedback

* Add translations
andrewstuart pushed a commit to andrewstuart/lemmy-ui that referenced this pull request Jul 27, 2023
* Make working password inputs

* Make show/hide password button use icon

* Tweak look

* Handle delete account form separately from change settings form

* Adjust password strengthometer position

* Incorporate PR feedback

* Add translations
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants