candle-annotator/openspec/specs/ui-shell/spec.md

954 B

ADDED Requirements

Requirement: Theme toggle in sidebar

The UI shell SHALL include a theme toggle button in the sidebar. The button SHALL be positioned at the bottom of the sidebar, visually separated from the tool buttons.

Scenario: Toggle button renders

  • WHEN the application loads
  • THEN a theme toggle button is visible at the bottom of the sidebar

Scenario: Toggle button displays correct icon

  • WHEN the current theme mode is "system"
  • THEN the button shows a monitor icon (lucide-react Monitor)
  • WHEN the current theme mode is "light"
  • THEN the button shows a sun icon (lucide-react Sun)
  • WHEN the current theme mode is "dark"
  • THEN the button shows a moon icon (lucide-react Moon)

Scenario: Toggle button has tooltip

  • WHEN user hovers over the theme toggle button
  • THEN a tooltip displays the current mode name (e.g., "Theme: System", "Theme: Light", "Theme: Dark")