Skip to main content interactive when super sidebar is inert

What does this MR do and why?

When the super sidebar is inert the "Skip to main content" link is not interactive for keyboard and screen reader users.

From !115630 (comment 1333303789)

Should the skip link be limited to the expanded navigation, or should it be available even when the sidebar is collapsed? I realize that when collapsed the clicks are minimal, but it's the difference between encountering "Expand sidebar, collapsed button" first and "Skip to content". The latter feels more consistent between experiences and also more clear at the moment because of how the sidebar button is announced.

The first interactive tab stop on any page should be consistent and should be the "Skip to main content" link. This is an unintended side effect of adding inert to the sidebar.

Changes

• Move "Skip to main content" link outside of becoming inert in <aside class="super-sidebar">
• Update styles to gl-fixed and required positioning, margin, & width
• Move .super-sidebar-skip-to styles before .super-sidebar to reflect element order on the DOM
• Create $super-sidebar-skip-to-z-index variable

Screenshots or screen recordings

CleanShot_2023-05-10_at_15.54.32

Expanded	Collapsed

How to set up and validate locally

1. Enable super sidebar (if not currently on)
   1. In rails c enable feature flag Feature.enable(:super_sidebar_nav)
   2. Toggle on "new navigation" in user menu
2. Press Tab to focus the "Skip to main content" link
3. Collapse/Expand super sidebar and Tab to focus the "Skip to main content" link again

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #410439 (closed)