From 032eb04fbafc71ae37e4abd941c6cd7f8bce3288 Mon Sep 17 00:00:00 2001 From: Skylinerffm97 Date: Mon, 28 Sep 2026 21:35:35 +0200 Subject: [PATCH] web(nav): announce the current page in a folded section to screen readers, document collapsible sections Co-Authored-By: Claude Opus 5.5 --- docs/content/docs/guides/unibox.mdx | 1 + web/src/components/layout/AppNav.tsx | 5 ++++- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/docs/content/docs/guides/unibox.mdx b/docs/content/docs/guides/unibox.mdx index a01560cfd..8db0b6ba6 100644 --- a/docs/content/docs/guides/unibox.mdx +++ b/docs/content/docs/guides/unibox.mdx @@ -15,6 +15,7 @@ The columns are yours to size. Every choice here is remembered in the browser yo | --- | --- | | The divider between the list and the thread | Drag it to widen the conversation list so long subjects fit, or to give the space back to the thread. It also takes the keyboard once it has focus: arrow keys nudge it (hold `Shift` for a bigger step), `Home` and `End` go to the narrowest and widest the window allows, `Enter` (or a double-click) puts it back to the default. | | **Collapse** at the bottom of the left navigation, or `b` | Shrinks Warmbly's own navigation to an icon rail and gives the width to the page. Row labels become tooltips; unread mail keeps its count badge and an open [Advisor](/guides/advisor/) finding shows as a coloured dot on the icon. The same control expands it again. | +| The section headers in the left navigation (Email, CRM, Resources) | Click one to fold its section away. Like the other layout choices, it is remembered in this browser. While a section is folded and you are on one of its pages, a small dot beside the header shows where you are. In the icon rail, folded sections stay hidden except the page you are on. | | The contact button in the thread header | Shows or hides the contact panel on the right. It starts closed when no preference is saved. Opening or closing it sticks across conversations, and existing preferences are preserved. | How wide the list can get depends on the window: the thread always keeps enough room to read a message, and the contact panel counts toward that when it is open, so the widest setting is narrower on a laptop than on a large monitor. diff --git a/web/src/components/layout/AppNav.tsx b/web/src/components/layout/AppNav.tsx index ef1bb6c3e..67995feb4 100644 --- a/web/src/components/layout/AppNav.tsx +++ b/web/src/components/layout/AppNav.tsx @@ -720,7 +720,10 @@ function Section({ > {section.label} {hidden && active && ( - + <> + + (contains current page) + )}