Skip to content

Add a dark mode to the dashboard - #118

Open
dchacke wants to merge 1 commit into
fractaledmind:mainfrom
dchacke:dark-mode
Open

dchacke wants to merge 1 commit into
fractaledmind:mainfrom
dchacke:dark-mode

Conversation

@dchacke

@dchacke dchacke commented Oct 18, 2026

Copy link
Copy Markdown

Donating some tokens so my eyes don’t hurt looking at the dashboard past 10pm… Here’s what my clanker wrote:


The dashboard now switches to a dark theme when the operating system is in dark mode. Light mode looks the same as before.

How

A prefers-color-scheme: dark media query at the end of _style.html.erb remaps the color utilities the views already use to darker shades from the Tailwind palette. It also sets color-scheme: light dark, so scrollbars and other browser-drawn controls match.

I went this way rather than adding dark: variants to the markup because the backtrace’s Application/Full toggle swaps text-blue-500 and text-gray-500 in JavaScript. A permanent dark:text-gray-400 on those buttons would override the selected one’s blue. With the remap, no view or script changes.

Screenshots

dark-error-list dark-error-page

Testing

  • Looked at the error list, the resolved tab and the error page with a full backtrace, in dark and light mode.
  • bundle exec rake test passes.

🤖 Generated with Claude Code

A prefers-color-scheme media query at the end of the stylesheet remaps
the light color utilities to dark ones, so the views and the classes the
backtrace toggle swaps stay as they are. Light mode is unchanged.

Session: claude://claude.ai/epitaxy/local_3aec44a6-88f2-4748-b579-16c5b9c08863
Co-Authored-By: Claude Opus 5.5 <claude@dennishackethal.com>
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.

1 participant