mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-13 06:36:26 +03:00
Paul Bakaus
648eb036ea
Three docs sidebar improvements. 1. Collapsible mobile menu. The sidebar on narrow viewports used to dump 21 skill links and 2 tutorial links inline above the content, forcing a long scroll past the nav. Add a toggle button at the top of the sidebar that shows the current page label (e.g. "/overdrive" or "Getting started") plus a chevron, and collapses the menu behind it on mobile. Click the button to open/close. On desktop (>=920px) the toggle is hidden and the menu shows unconditionally as before. Pure aria-expanded state driven by a small delegated click handler in render-page.js. 2. Active-state breathing room. The left-border accent on the current sidebar item used to sit 2px from the text, which felt cramped. Pull the border 14px to the left via margin-left and push the text 12px to the right via padding-left. The net result: the accent bar sits in the layout gutter, the text keeps its alignment with the brand logo in the header, and there's now 12px of comfortable space between the border and the text. 3. Active state visibility. The same change makes the accent bar more visible on desktop, since it no longer hugs the text. 'aria-current' was already being set correctly on /skills/* and /tutorials/* pages; the bar just looked too subtle at 2px of clearance.