Skip to content

fix: add dark mode support for charts page#17

Open
overtrue wants to merge 1 commit into
mainfrom
fix/dark-mode-support
Open

fix: add dark mode support for charts page#17
overtrue wants to merge 1 commit into
mainfrom
fix/dark-mode-support

Conversation

@overtrue

Copy link
Copy Markdown

Problem

Text is invisible/unreadable on https://charts.rustfs.com/ when system is in dark mode. The page only defines light CSS variables, and data-color-mode is hardcoded to light.

Fix

  • Load github-markdown-dark.min.css conditionally via prefers-color-scheme: dark media query
  • Add @media (prefers-color-scheme: dark) block overriding all CSS custom properties (backgrounds, text, borders, code blocks, links)
  • Set data-color-mode="auto" on <body> so github-markdown-css dark selectors activate
  • Cover all major elements: headings, code/pre, tables, blockquotes, hr, quick-install panel

Verification

  • Open site with system dark mode on → all text readable with proper contrast
  • Open site with system light mode on → unchanged behavior

Add prefers-color-scheme: dark media query with GitHub dark theme
colors so text is readable when system is in dark/night mode.

- Load github-markdown-dark.min.css conditionally via media query
- Override all CSS custom properties for dark mode
- Set data-color-mode=auto so github-markdown-css dark styles activate
- Cover headings, code blocks, tables, blockquotes, hr, quick-install panel
Copilot AI review requested due to automatic review settings July 20, 2026 14:16

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@cloudflare-workers-and-pages

Copy link
Copy Markdown
Contributor

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
helm f9c2f33 Jul 20 2026, 02:16 PM

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