Fix: Switch code highlighting theme to min-light/min-dark#1815
Fix: Switch code highlighting theme to min-light/min-dark#1815benjamin-747 merged 1 commit intoweb3infra-foundation:mainfrom
Conversation
juanlou1217
commented
Jan 16, 2026
- Change the code highlighting theme from github-light/github-dark to min-light/min-dark
- Add global text selection style with a blue background (rgb(191 219 254 / 0.8))
- Change the code highlighting theme from github-light/github-dark to min-light/min-dark - Add global text selection style with a blue background (rgb(191 219 254 / 0.8))
|
@codex review |
There was a problem hiding this comment.
Pull request overview
This PR updates the code highlighting theme from GitHub's themes to minimal themes and adds global text selection styling. The changes aim to provide a cleaner, more minimalist appearance for code viewing.
Changes:
- Switched code highlighting themes from
github-light/github-darktomin-light/min-darkin diff and editor components - Added global text selection styling with a semi-transparent blue background
- Updated code content rendering structure with an additional wrapper span
- Modified text selection CSS to inherit text color instead of forcing white
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| moon/apps/web/styles/global.css | Added global text selection styles with blue background for both standard and Firefox-specific selectors |
| moon/apps/web/components/DiffView/FileDiff.tsx | Updated theme configuration to use min-light/min-dark themes |
| moon/apps/web/components/CodeView/BlobView/CodeContent.tsx | Changed hardcoded theme to min-light and restructured line rendering with additional wrapper span |
| moon/apps/web/components/CodeView/BlobView/CodeContent.module.css | Updated selection styles to inherit text color instead of forcing white, removed previewContainer selector |
| moon/apps/web/components/CodeView/BlobView/BlobEditor.tsx | Updated theme configuration to use min-light/min-dark themes |
| const result = await codeToTokens(blockContent, { | ||
| lang: detectedLanguage as any, | ||
| theme: 'github-light' | ||
| theme: 'min-light' |
There was a problem hiding this comment.
The theme is hardcoded to 'min-light' without dark mode support. While FileDiff.tsx and BlobEditor.tsx properly use theme objects with both light and dark variants (e.g., { dark: 'min-dark', light: 'min-light' }), this component only uses the light theme. This creates an inconsistent user experience where code highlighting won't respond to dark mode preferences.
| theme: 'min-light' | |
| theme: { dark: 'min-dark', light: 'min-light' } |
| codeToTokens(fileContent, { | ||
| lang: detectedLanguage as any, | ||
| theme: 'github-light' | ||
| theme: 'min-light' |
There was a problem hiding this comment.
The theme is hardcoded to 'min-light' without dark mode support. While FileDiff.tsx and BlobEditor.tsx properly use theme objects with both light and dark variants (e.g., { dark: 'min-dark', light: 'min-light' }), this component only uses the light theme. This creates an inconsistent user experience where code highlighting won't respond to dark mode preferences.
| theme: 'min-light' | |
| theme: { dark: 'min-dark', light: 'min-light' } |
|
Codex Review: Didn't find any major issues. What shall we delve into next? ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍. Codex can also answer questions or update the PR. Try commenting "@codex address that feedback". |
8fec47b