Skip to content

Conversation

@murataslan1
Copy link
Contributor

Summary

Fixes the password show/hide icon not toggling correctly when clicking the visibility button.

Problem

The eye icon remained static even when the password visibility state changed. This was confusing for users as there was no visual feedback from the toggle button.

Solution

  • Added an eye-off SVG icon for when the password is visible
  • Used Alpine.js x-show directive to conditionally display the appropriate icon based on the type state
  • Updated the click handler to toggle the type state, syncing the icon with the visibility state

Affected Pages

  • Sign In page
  • Create Account page
  • Any page using the password input component

Fixes #7721

The eye icon now correctly toggles between eye and eye-off states when clicking
the password visibility toggle button. Previously, the icon remained static
even though the password visibility changed.

Changes:
- Add eye-off SVG icon for when password is visible
- Use Alpine.js x-show directive to conditionally display appropriate icon
- Update click handler to toggle type state for icon synchronization

Fixes coollabsio#7721
@Cinzya Cinzya added the UI/UX label Dec 21, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: UI Bug: Password show/hide icon does not toggle correctly

2 participants