Conversation
Adds a visually hidden "Skip to main content" link at the top of the application that becomes visible when focused. This allows keyboard and screen reader users to bypass the Sidebar navigation and jump directly to the 3D viewer content area. Updates the main content container to use semantic `<main>` tags and accept programmatic focus without showing an outline. Co-authored-by: ELO2026X <153048533+ELO2026X@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. |
💡 What
Added a "Skip to main content" link to the root
Appcomponent, allowing users to bypass the sidebar navigation. Also updatedContentViewto act as the target by using a semantic<main>tag withid="main-content"andtabIndex={-1}.🎯 Why
For users who rely on keyboard navigation or screen readers, having to tab through a persistent sidebar every time they want to interact with the main content area is extremely tedious. A skip link is a standard accessibility best practice to solve this problem.
📸 Before/After
Before: Keyboard users must tab through every single effect button in the sidebar before reaching the "Upload Custom Model" button or interacting with the 3D view.
After: The first tab press immediately focuses the "Skip to main content" link. Pressing Enter immediately shifts focus to the main content area, allowing the user to bypass the entire sidebar.
♿ Accessibility
<main>tag for the primary content area..sr-onlybut becomes visible when receiving focus via.focus-visible:not-sr-onlyto ensure sighted keyboard users can see it.focus:outline-none.PR created automatically by Jules for task 2242009912088168453 started by @ELO2026X