Skip to content
This repository has been archived by the owner on Jan 23, 2025. It is now read-only.

MG-177 - Add password visibility eye toggle functionality to magistrala login page #248

Merged
merged 7 commits into from
Mar 19, 2024

Conversation

wambui-pixel
Copy link
Contributor

@wambui-pixel wambui-pixel commented Mar 18, 2024

What type of PR is this?

  • Refactor
  • Feature
  • Bug Fix
  • Optimization
  • Documentation Update
  • Dependency Update

What does this do?

Adding an eye visibility toggle function to the login page allowing users to toggle on to see the password and toggle off to not see the password.

Which issue(s) does this PR fix/relate to?

Have you included tests for your changes?

  • Yes
  • No, and this is why:

Did you document any new/modified functionality?

Yes

  • Yes
  • No, and this is why:

Notes

Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
…ate password and reset password pages

Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
@wambui-pixel wambui-pixel marked this pull request as ready for review March 19, 2024 09:22
@@ -51,6 +51,7 @@ <h2>Login</h2>
id="password"
placeholder="Password"
Copy link
Contributor

Choose a reason for hiding this comment

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

Increase the margin between the input and the eye
image

to do this you can add a bootstrap class me-2 to the input element. Do this for the envelope in the email-field too and the lock in the password field. They will look sth like
<i class="fas fa-solid fa-envelope me-2"></i>
<i class="fas fa-solid fa-lock me-2"></i>
<input class="p-3 w-100 me-2" type="password" name="password" id="password" placeholder="Password" />

Do this for the other forms as well

.catch((error) => {
console.error("error submitting login form: ", error);
});
}
//code for toggling the visibility of the password
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
//code for toggling the visibility of the password
// Code for toggling the visibility of the password

Copy link
Contributor

Choose a reason for hiding this comment

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

change the other comments as well

Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
Signed-off-by: wambuipixel <kiokowambui015@gmail.com>
Copy link
Contributor

@ianmuchyri ianmuchyri left a comment

Choose a reason for hiding this comment

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

LGTM

@dborovcanin dborovcanin merged commit 1ae4a0f into absmach:main Mar 19, 2024
2 checks passed
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

View password functionality
4 participants