🎨 Palette: Accessibility and Semantic HTML Overhaul#26
Conversation
…mponents This change refactors `GameCard`, `GameDetailHeader`, and `GameScreenshotsCarousel` to use semantic HTML and improve accessibility. 💡 What: - Converted metadata spans and folder paths to `<button type="button">`. - Added `aria-label` to icon-only buttons, badges, and filters. - Implemented consistent `focus-visible` ring styles for keyboard navigation. - Added `aria-labelledby` to `GameCard` for screen reader context. - Marked decorative icons and overlays with `aria-hidden="true"`. - Fixed an unused variable TypeScript error in `GameScreenshotsCarousel.tsx`. 🎯 Why: Makes the application fully navigable via keyboard and accessible to screen reader users, while maintaining the same visual design. ♿ Accessibility: - Native keyboard support for all interactive elements. - Clear focus indicators. - Proper ARIA roles and labels for all interactive elements. Co-authored-by: Gamepulse <8333979+Gamepulse@users.noreply.github.com>
|
👋 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 New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
1 participant
Refactored core library components to use semantic
<button>elements instead of non-semantic tags with click handlers. Added ARIA labels, focus-visible styles, and improved screen reader context forGameCardandGameDetailHeader. Also fixed a pre-existing TypeScript error inGameScreenshotsCarousel.PR created automatically by Jules for task 9793544045812466522 started by @Gamepulse