Merged
Conversation
Add a ThemeToggle component with moon/computer/sun icons that appears in both the Settings page (under a new Appearance section) and the "More" menu in the sidebar. The toggle persists as themeMode in CeptSettings. Convert all dark mode CSS from @media (prefers-color-scheme: dark) to .dark class-based selectors so the theme can be controlled programmatically via a useTheme hook that manages the dark class on <html>. https://claude.ai/code/session_01QddASAFJgFoPPTDS88nkq2
Contributor
Release Version Check
This version will be released automatically when this PR is merged to |
Contributor
Preview DeploymentThe web app for this PR has been deployed: Use this to verify the app works correctly, especially for dependency updates. |
Components missing dark mode coverage: command palette, search, knowledge graph, database views, git/repo picker, and breadcrumbs. Also imports git-styles.css in globals.css. https://claude.ai/code/session_01QddASAFJgFoPPTDS88nkq2
- Add dark mode syntax highlighting colors for code blocks (hljs tokens) - Add dark mode callout block backgrounds (blue, green, yellow, red, purple) - Add dark mode styles for settings file browser meta text and breadcrumbs - Fix knowledge graph D3 inline colors to be theme-aware (link strokes, node borders, label text) https://claude.ai/code/session_01QddASAFJgFoPPTDS88nkq2
Tailwind v4 defaults to media-query-based dark mode, so `dark:` utilities only respond to `prefers-color-scheme`. Our useTheme hook toggles the `.dark` class on <html>, which requires the selector strategy. Add `@custom-variant dark` to globals.css so both Tailwind utilities (dark:bg-*) and custom CSS selectors (.dark .cept-*) work with the class toggle. https://claude.ai/code/session_01QddASAFJgFoPPTDS88nkq2
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
themeModeinCeptSettings(default:system)useThemehook manages thedarkclass on<html>, listening to OS preference when in system mode@custom-variant dark— without this,dark:utilities only respond to the OS media query, not the.darkclass togglegit-styles.cssinglobals.cssso git component styles are loadedTest plan
https://claude.ai/code/session_01QddASAFJgFoPPTDS88nkq2