Add a light theme

Đang mở
#266 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Maintainer thường phản hồi trong vòng 1 ngày

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
45/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Sôi nổi
Công nghệ
css, nextjs, react, typescript
Lĩnh vực
accessibility, design, frontend

Hướng nghiên cứu

Start in src/app/globals.css and list the tokens of the single dark palette; the prefers-reduced-motion rule around line 415 is the pattern to copy for a prefers-color-scheme block. Then grep for hard-coded colors, first at src/lib/public-metrics/card-image.tsx:20-29. Done means both themes pass axe on every screen, no hard-coded dark color remains, and each token pair's 4.5:1 contrast is recorded; the manual-switch question in the issue is still undecided, so confirm it before building one.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

accessibility area: web blocked enhancement impact: low priority: P3 size: M

Summary

DevMacro has only a dark theme, so people who set their system to light mode, or who read better on a light background, get the dark palette everywhere. The app should offer a light palette that follows the system setting, with every token pair readable at 4.5 to 1 for body text.

Found in the UX review of integration/demo-2026-11 (pull request #205) at ce44e95, on the seeded demo workspace with simulated data.

Evidence

  • src/app/globals.css defines one dark palette and has no prefers-color-scheme rule. The only media query on a user preference is prefers-reduced-motion at src/app/globals.css:415.
  • The share cards hard-code the same dark colors (src/lib/public-metrics/card-image.tsx:20-29).

The dashboard in its only theme, dark

Scope

  • A light palette that follows the system setting, with every token pair at 4.5 to 1 for body text.

Acceptance criteria

  • Light and dark both pass axe on every app screen.
  • No hard-coded dark color left in components.
  • A contrast check for each token pair recorded on the pull request.

Decisions needed

  • Whether a manual theme switch is wanted as well as following the system.

Model: anthropic/claude-opus-5-5 | Reasoning effort: unknown

Ngôn ngữ chính
TypeScript
Star
1
Fork
1
Merge trung bình
6 giờ 56 phút
Pull request đã merge (30 ngày)
136

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của eddiejaoude/StackDash

Tất cả issue của eddiejaoude/StackDash

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.