feat(chat): a11y improvements and small-phone breakpoint#359
Merged
Conversation
Extracted a11y/mobile polish from #323, independent of its larger React 19 refactor: - aria-label on copy/edit/regenerate/branch-nav message actions and the edit textarea, so screen readers announce purpose instead of glyphs - .messageBlock:focus-within reveals the action row during keyboard nav - focus-visible outlines on composer input, attach, and send buttons - .composer:focus-within border highlight - @media (max-width: 480px) small-phone breakpoint: wider bubbles, tighter padding, smaller empty-state heading - @media (prefers-reduced-motion: reduce): disable thinking-dot and sidebar slide-in animations - Cap slash suggestions at 40vh below 900px so they don't cover the whole screen - Fix sidebar overlay blocking backdrop clicks: replace inset: 0 on .sidebarOpen with explicit top/left/bottom so the 280px panel no longer stretches across the viewport Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Member
Author
Code reviewNo issues found. Checked for bugs and CLAUDE.md compliance. 🤖 Generated with Claude Code - If this code review was useful, please react with 👍. Otherwise, react with 👎. |
5 tasks
furukama
approved these changes
Apr 20, 2026
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
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.
Summary
Extracted from #323 as an independent PR. Touches only the chat page styles, message actions, and one test — no overlap with the Button extraction (#358) or the pending React 19 refactor.
Accessibility
Mobile / responsive
Bug fix
Test plan
🤖 Generated with Claude Code