Skip to content

Add dark mode, accessibility, file grouping, and toast notifications#3

Open
deactivejb wants to merge 1 commit intocoderabbitai:mainfrom
deactivejb:feature/dark-mode-and-accessibility
Open

Add dark mode, accessibility, file grouping, and toast notifications#3
deactivejb wants to merge 1 commit intocoderabbitai:mainfrom
deactivejb:feature/dark-mode-and-accessibility

Conversation

@deactivejb
Copy link

Summary

  • Dark mode with CSS custom properties, prefers-color-scheme detection, and manual light/dark/system toggle button in the popup
  • Accessibility improvements: ARIA roles (role="switch", role="status", role="list"), aria-label on all interactive elements, aria-live region for screen reader announcements, focus-visible outlines for keyboard navigation
  • Per-file comment grouping in the popup showing severity badge breakdown per file, with click-to-scroll navigation that highlights the target file
  • Toast notifications on the GitHub page when filter settings change
  • Severity count badges next to each toggle in the popup
  • Quick action buttons: Show All, Hide All, Issues Only

Changes

  • 5 files modified: content.js, content.css, popup.html, popup.js, manifest.json
  • +737 lines of new functionality

Test plan

  • Load extension and verify popup renders correctly in light mode
  • Click the moon icon to cycle through system -> dark -> light themes
  • Verify dark mode colors apply correctly to all popup elements
  • Tab through all interactive elements and verify focus outlines appear
  • Use a screen reader and verify ARIA labels are announced correctly
  • Open a GitHub PR with CodeRabbit comments and verify severity counts appear
  • Verify per-file grouping shows correct files with severity mini-badges
  • Click a file in the grouping list and verify the page scrolls to that file
  • Toggle a severity filter and verify a toast notification appears on the page
  • Click Show All / Hide All / Issues Only and verify correct behavior

🤖 Generated with Claude Code

…otifications

- Add full dark mode support with CSS custom properties and system preference
  detection via prefers-color-scheme, plus manual light/dark/system toggle
- Add ARIA roles, labels, live regions, and focus-visible outlines for
  screen reader and keyboard navigation accessibility
- Add per-file comment grouping in the popup showing severity breakdown
  per file with click-to-scroll navigation
- Add toast notifications on the GitHub page when filters change
- Add severity count badges next to each toggle in the popup
- Add quick action buttons (Show All, Hide All, Issues Only)
- Add scroll-to-file with highlight animation when clicking file groups
- Bump version to 1.2.0

Co-Authored-By: Claude Opus 4.6 <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants