fix: dark theme broken on new ComfyUI frontend - #82
Open
Samurai019 wants to merge 2 commits into
Open
Samurai019 wants to merge 2 commits into
Samurai019 wants to merge 2 commits into
Conversation
The new Vue-based ComfyUI frontend applies the .dark-theme class to document.documentElement (<html>) instead of <body>, so the 'body.dark-theme' selector no longer matches and the popup falls back to light-theme variables (light gray rows on a dark UI). Match ':root.dark-theme body' as well to stay compatible with both old and new frontends.
|
Verified this fix locally against ComfyUI 0.34.0 with Before applying the selector change:
After applying this PR:
This directly resolves the light autocomplete rows on the current Vue frontend. |
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.
Problem
The new Vue-based ComfyUI frontend applies the
.dark-themeclass todocument.documentElement(<html>) instead of<body>:As a result, the
body.dark-theme { ... }selector inautocomplete-plus.cssno longer matches, and the autocomplete / related-tags popups fall back to the light-theme variables — light gray rows (--p-neutral-300/400) on a dark UI, making text hard to read.Fix
Match
:root.dark-theme bodyin addition tobody.dark-theme, so the dark theme variables apply on both the old frontend (class on<body>) and the new frontend (class on<html>).Tested locally on the latest ComfyUI frontend: popup rows render with the correct dark colors again.