Skip to content

🎨 Palette: Accessible Forms and Password Toggle in V2 Signup#85

Open
godie wants to merge 1 commit intomasterfrom
palette-accessible-v2-forms-2914540938942252997
Open

🎨 Palette: Accessible Forms and Password Toggle in V2 Signup#85
godie wants to merge 1 commit intomasterfrom
palette-accessible-v2-forms-2914540938942252997

Conversation

@godie
Copy link
Copy Markdown
Owner

@godie godie commented Mar 30, 2026

I have implemented a micro-UX improvement by adding a password visibility toggle to the V2 Signup page and improving form accessibility across the V2 Signup and Forgot Password pages.

💡 What:

  • Integrated a password visibility toggle (Material Icon 'visibility'/'visibility_off') in V2Signup.jsx.
  • Standardized label-input associations using id and htmlFor across authentication forms.
  • Marked decorative icons with aria-hidden="true".

🎯 Why:

  • Improves usability during account creation by allowing users to verify their password.
  • Ensures screen readers correctly identify and associate form fields.
  • Maintains UI/UX consistency across the V2 authentication suite.

Accessibility:

  • Full label and input association.
  • Icon-only buttons (the toggle) include aria-label and title for screen readers and mouse users.
  • Cleaned up the accessibility tree by hiding decorative icons.

Verified visual changes with Playwright screenshots and ensured all existing tests pass.


PR created automatically by Jules for task 2914540938942252997 started by @godie

This commit improves the micro-UX and accessibility of the V2 authentication flow:
- Added password visibility toggle to V2Signup.jsx to match V2Login.jsx.
- Properly associated labels with inputs using `id` and `htmlFor` in V2Signup.jsx and V2ForgotPassword.jsx.
- Added `aria-hidden="true"` to decorative icons for better screen reader compatibility.
- Updated Palette's journal with accessibility learnings.

Verified with Playwright screenshots and full unit test suite.

Co-authored-by: godie <227743+godie@users.noreply.github.com>
@google-labs-jules
Copy link
Copy Markdown
Contributor

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

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.

1 participant