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

Improve accessibility and translations across the UI #690

Merged
merged 5 commits into from
Feb 8, 2025

Conversation

tjementum
Copy link
Member

@tjementum tjementum commented Feb 8, 2025

Summary & Motivation

Performed a full review of translations and accessibility across the website, ensuring correct ARIA labels and consistent terminology.

  • Added ARIA labels to LocaleSwitcher, ThemeModeSelector, and AvatarButton, ensuring they are always visible and correctly translated.
  • Improved accessibility for one-time password input fields by adding meaningful ARIA labels.
  • Updated the User Profile Modal to include proper ARIA labels and changed the placeholder example name from "Olivia Rhye" to "Alex Taylor" for a more inclusive default.
  • Standardized terminology by replacing "avatar" and "photo" with "profile picture" in the User Profile dialog.
  • Added an ARIA label and translation for the toggle collapsed menu button.

Downstream projects

Please update all usages of LocaleSwitcher, ThemeModeSelector, and AvatarButton to include ARIA labels. Also, consider fixing all accessibility issues and translations in your self-contained systems.

Checklist

  • I have added tests, or done manual regression tests
  • I have updated the documentation, if necessary

@tjementum tjementum added the Enhancement New feature or request label Feb 8, 2025
@tjementum tjementum self-assigned this Feb 8, 2025
@tjementum tjementum force-pushed the pp-320-accessibility-and-translation-fixes branch from 2a5883c to 6fc016b Compare February 8, 2025 16:57
Copy link

sonarqubecloud bot commented Feb 8, 2025

Quality Gate Failed Quality Gate failed

Failed conditions
33.3% Duplication on New Code (required ≤ 3%)

See analysis details on SonarQube Cloud

@tjementum tjementum merged commit b9d52f5 into main Feb 8, 2025
11 of 12 checks passed
@tjementum tjementum deleted the pp-320-accessibility-and-translation-fixes branch February 8, 2025 17:03
tjementum added a commit that referenced this pull request Feb 8, 2025
### Summary & Motivation

Performed a full review of translations and accessibility across the
website, ensuring correct ARIA labels and consistent terminology.

- Added ARIA labels to LocaleSwitcher, ThemeModeSelector, and
AvatarButton, ensuring they are always visible and correctly translated.
- Improved accessibility for one-time password input fields by adding
meaningful ARIA labels.
- Updated the User Profile Modal to include proper ARIA labels and
changed the placeholder example name from "Olivia Rhye" to "Alex Taylor"
for a more inclusive default.
- Standardized terminology by replacing "avatar" and "photo" with
"profile picture" in the User Profile dialog.
- Added an ARIA label and translation for the toggle collapsed menu
button.

### Downstream projects

Please update all usages of LocaleSwitcher, ThemeModeSelector, and
AvatarButton to include ARIA labels. Also, consider fixing all
accessibility issues and translations in your self-contained systems.

### Checklist

- [x] I have added tests, or done manual regression tests
- [x] I have updated the documentation, if necessary
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Enhancement New feature or request
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

1 participant