Add skip-to-main-content link for keyboard users

[josephchimebuka]

Problem

The app shell lacks a skip link for keyboard/screen reader users bypassing repeated navigation.

Scope

• Visually hidden skip link as first focusable element
• Targets main content landmark on each route

Acceptance criteria

• Skip link visible on focus
• Moves focus to <main> content

Files

• src/App.tsx, src/index.css

[abbys-code-hub]

@abbys-code-hub has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I wiuld love to take this on please.
Keyboard and screen reader users benefit enormously from skip links—they can jump directly to content instead of tabbing through repeated navigation. It's a small feature with real impact for accessibility-reliant users.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @abbys-code-hub to this issue.

[sulaimonifeoluwa4-blip]

@sulaimonifeoluwa4-blip has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hi can I work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @sulaimonifeoluwa4-blip to this issue.

[Stanley-Owoh]

@Stanley-Owoh has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Good day maintainer please I would like to work on this please assign it to me thank you

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Stanley-Owoh to this issue.

[Nacho1499]

@Nacho1499 has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hello maintainer, am Nacho. a frontend developer.

I would like to work on this issue.

I have experience building React and TypeScript applications with a focus on creating responsive and accessible user interfaces. I am familiar with accessibility best practices, including keyboard navigation and semantic HTML.

For this issue, I plan to:

• Add a visually hidden "Skip to main content" link as the first focusable element in the application.
• Ensure the link becomes visible when focused via keyboard.
• Connect the skip link to the main content landmark on every route.
• Move keyboard focus correctly to the main content after activation.
• Add the necessary styles in src/index.css while keeping the implementation consistent with the existing design.
• Verify the feature works correctly using keyboard-only navigation and does not introduce any regressions.

I will keep the implementation simple, accessible, and aligned with the project's coding standards.

Thank you for your consideration.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Nacho1499 to this issue.

[techAlhaji]

@techAlhaji has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Can I work on this please?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @techAlhaji to this issue.

[teethaking]

@teethaking has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

hello, please may i work on this issue?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @teethaking to this issue.

[Oyinkans0la12]

@Oyinkans0la12 has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I'd like to resolve this please.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Oyinkans0la12 to this issue.

[iwayemi5]

@iwayemi5 has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I would like to work on this issue as I have reviewed the scope, I should have a PR Ready in 50 minutes.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @iwayemi5 to this issue.

[VeronicDev]

@VeronicDev has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hello maintainer pls assign me this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @VeronicDev to this issue.

[jotel-dev]

@jotel-dev has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Pls Assign me

ℹ️ Repo Maintainers: To accept this application, review their application or assign @jotel-dev to this issue.