Make the sidebar resizable, scrollable, and icon-tabbed - #124
Merged
Conversation
Closes #123. - Add a resize handle on the sidebar's left edge: drag with the pointer, or focus it and use arrow keys / Home / End (ARIA window splitter with aria-valuenow announcements). Width is clamped to 180px-60vw and persisted to localStorage. - Give every sidebar tab an icon. Labels show alongside icons when the bar has room and collapse to icon-only (with tooltips) when squished; the label text stays in the accessibility tree either way. - Fix mobile sidebar clipping: tab panels now cap their own height and scroll top-to-bottom instead of being cut off by the aside's max-height. - Import sidebar.css, which was never actually imported anywhere - all its rules were dead. Neutralize the rules that would have conflicted now that they're live (double panel padding, display:flex overriding the hidden attribute on the collapsed sidebar). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0175eEy1tMaz2woc7cqjwCGe
The pull_request event for the original push never produced a workflow run; empty commit to fire a synchronize event. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_0175eEy1tMaz2woc7cqjwCGe
github-actions Bot
pushed a commit
that referenced
this pull request
Aug 26, 2026
…veness Make the sidebar resizable, scrollable, and icon-tabbed f0a4a48
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #123.
The sidebar dreamed of being responsive; this grants all three wishes.
Width-resizable
role="separator",aria-orientation="vertical",aria-valuenow/min/max) so screen readers announce the width as it changes.Icon tabs
Ctrl+Shift+Nswitching is unaffected.Tabscomponent keeps icons optional, so the preferences dialog is unchanged.Scrollable top-to-bottom
max-height: 40vhclipped content because max-height on an auto-height container can't shrink its children. Tab panels now cap their own height on mobile and scroll.Bonus fix uncovered along the way
src/components/sidebar.csswas never imported anywhere — every rule in it was dead. It's now imported bysidebar.tsx, with the two rules that would have caused regressions neutralized (double panel padding;display: flexoverriding thehiddenattribute on the collapsed sidebar rail).Verification
tsc --noEmitclean; all 1104 vitest tests pass.🤖 Generated with Claude Code
https://claude.ai/code/session_0175eEy1tMaz2woc7cqjwCGe