fix(voyage): move sidebar toggle outside aria-hidden region (09132940)
This commit is contained in:
parent
c08bde0649
commit
48ab3c9de3
2 changed files with 56 additions and 21 deletions
|
|
@ -540,9 +540,16 @@
|
|||
}
|
||||
.voyage-sidebar[aria-hidden="true"] .voyage-sidebar__panel { visibility: hidden; }
|
||||
|
||||
/* 2-state FAB toggle (per critical decision #4) */
|
||||
/* 2-state FAB toggle (per critical decision #4).
|
||||
v4.3 Step 3 — position: fixed so toggle stays reachable when the
|
||||
sidebar carries aria-hidden="true" (finding 09132940 a11y).
|
||||
The toggle is now a sibling of the <aside>, not a descendant,
|
||||
so the aria-hidden subtree no longer hides the toggle from AT. */
|
||||
.voyage-fab {
|
||||
position: relative;
|
||||
position: fixed;
|
||||
top: var(--space-3);
|
||||
right: 4px;
|
||||
z-index: 901;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
padding: 0;
|
||||
|
|
@ -962,6 +969,28 @@
|
|||
</section>
|
||||
</main>
|
||||
|
||||
<!-- v4.3 Step 3 (finding 09132940) — toggle button is a sibling of the
|
||||
<aside aria-hidden="true"> so it remains exposed to AT regardless
|
||||
of sidebar-hidden state. CSS .voyage-fab uses position: fixed
|
||||
(z-index: 901) so it floats over the sidebar at all times. -->
|
||||
<button
|
||||
type="button"
|
||||
id="voyage-sidebar-toggle"
|
||||
class="voyage-fab"
|
||||
data-action="toggle-sidebar"
|
||||
aria-controls="voyage-sidebar"
|
||||
aria-expanded="false"
|
||||
aria-label="Skjul/vis annotation-panel"
|
||||
>
|
||||
<span
|
||||
id="voyage-fab-badge"
|
||||
class="voyage-fab__badge"
|
||||
aria-live="polite"
|
||||
aria-label="Antall drafts ventende"
|
||||
hidden
|
||||
>0</span>
|
||||
</button>
|
||||
|
||||
<!-- v4.3 Step 19 — sidebar-rail (hidden-by-default) with ordered annotation-list,
|
||||
filter (Alle/Åpne/Resolved), and jumplist count "X av N". Toggle via
|
||||
FAB data-action="toggle-sidebar" or ] keyboard shortcut (Step 20). -->
|
||||
|
|
@ -971,25 +1000,7 @@
|
|||
aria-label="Annotation drafts sidebar"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div class="voyage-sidebar__rail">
|
||||
<button
|
||||
type="button"
|
||||
id="voyage-sidebar-toggle"
|
||||
class="voyage-fab"
|
||||
data-action="toggle-sidebar"
|
||||
aria-controls="voyage-sidebar"
|
||||
aria-expanded="false"
|
||||
aria-label="Skjul/vis annotation-panel"
|
||||
>
|
||||
<span
|
||||
id="voyage-fab-badge"
|
||||
class="voyage-fab__badge"
|
||||
aria-live="polite"
|
||||
aria-label="Antall drafts ventende"
|
||||
hidden
|
||||
>0</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="voyage-sidebar__rail" aria-hidden="true"></div>
|
||||
<div class="voyage-sidebar__panel">
|
||||
<!-- v4.3 Step 19 — ordered annotation list with filter + jumplist count -->
|
||||
<div class="voyage-annotation-list" aria-label="Ordered annotation list">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue