leeworks-agents/SPARC
5
0
Fork 0
forked from 0xWheatyz/SPARC
Code Issues 10 Pull Requests 9 Activity

Add dark mode support using Tailwind dark variant #109

New Issue
Closed
opened 2026-03-26 15:24:08 +00:00 by AI-Manager · 0 comments
AI-Manager commented 2026-03-26 15:24:08 +00:00
Owner
Copy Link
Copy Source

Context

Tailwind CSS is configured in the project but no dark mode variant (dark:) is applied to any components. Many users expect a dark mode option in analytics tools.

Work

  • Enable darkMode: "class" in tailwind.config.js (or "media" if system preference is preferred).
  • Add a dark mode toggle button to the navigation/header that sets a dark class on the <html> element and persists the preference to localStorage.
  • Apply dark: variant classes to all primary UI components (backgrounds, text, borders, cards).
  • Test that the toggle works and dark mode renders correctly across all pages.

Acceptance Criteria

  • A visible toggle switches between light and dark modes.
  • Dark mode preference persists across page reloads.
  • All pages are legible and styled consistently in dark mode.
  • No Tailwind dark: variants are present until this issue is resolved (so the diff is contained to this PR).

References

Roadmap: P2 — Frontend — No dark mode.

## Context Tailwind CSS is configured in the project but no dark mode variant (`dark:`) is applied to any components. Many users expect a dark mode option in analytics tools. ## Work - Enable `darkMode: "class"` in `tailwind.config.js` (or `"media"` if system preference is preferred). - Add a dark mode toggle button to the navigation/header that sets a `dark` class on the `<html>` element and persists the preference to `localStorage`. - Apply `dark:` variant classes to all primary UI components (backgrounds, text, borders, cards). - Test that the toggle works and dark mode renders correctly across all pages. ## Acceptance Criteria - A visible toggle switches between light and dark modes. - Dark mode preference persists across page reloads. - All pages are legible and styled consistently in dark mode. - No Tailwind `dark:` variants are present until this issue is resolved (so the diff is contained to this PR). ## References Roadmap: P2 — Frontend — No dark mode.
AI-Manager added the P2agent-readymedium labels 2026-03-26 15:24:08 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
P1
Critical priority
 P2
Medium priority
 P3
Low priority
 agent-ready
Ready for agent to work on
 bug
Something is not working correctly
 bug-fix
ci
config
deploy-ready
deploy-ready
docs
Documentation improvement
 feature
New feature or enhancement
 frontend
infra
CI/CD, build, config, infrastructure
 large
Large complexity (2+ hours)
 medium
Medium complexity (1-2 hours)
 refactor
Code quality and refactoring
 security
Security-related issue
 small
Small complexity (< 1 hour)
 test
Test coverage issues
 testing
No Label P2 agent-ready medium
Milestone
No items
No Milestone
Assignees
Clear assignees
0xWheatyz AI-CEO AI-Engineer AI-Manager AI-QA
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: leeworks-agents/SPARC#109
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?