-
-
Notifications
You must be signed in to change notification settings - Fork 24
Description
Description
Code blocks (notebook cell inputs) are rendering with a dark gray background in what appears to be a light-mode context. Screenshots show the cell_input area using the dark theme palette (dark gray background with blue left border and green/teal syntax highlighting) while the surrounding page content is rendering in light mode.
Screenshots
Two pages affected:
- A page with Boolean value examples (primitive data types section)
- A page with a matplotlib/numpy code example (Version 1 section)
In both cases, the div.cell div.cell_input block has a dark gray background (#555 or similar) with coloured syntax highlighting, inconsistent with the light-mode page background.
Possible causes
-
Dark mode class applied early / FOUC in reverse — the early inline script that applies the dark mode class (added in v0.18.0, feat: comprehensive dark theme overhaul #365) may be applying
dark-themeon initial load even when the user preference is light, and the cell input background is not being correctly reverted when switching back to light mode. -
CSS specificity conflict —
_dark-theme.scsssetsdiv.cell div.cell_input { background-color: var(--qe-dark-code-bg); }and this may be winning over the light-theme default in some render paths. -
Pydata Sphinx Theme default — the underlying
pydata_sphinx_thememay be setting a dark background on.highlightorcell_inputthat isn't being overridden in the light theme path. -
background: nonenot reaching cell inputs —_content.scsssetsdiv.highlight { background: none; }butcell_inputwraps the highlight div, so this rule may not be sufficient to clear the background.
Steps to reproduce
View any notebook page on the quantecon-book-theme branch build of lecture-python-programming.myst (or the Netlify preview for PR #371) with the browser/OS set to light mode.
Expected behaviour
Code cell input blocks should have a light (or transparent) background in light mode, consistent with the rest of the page.
Related
- Dark theme overhaul: feat: comprehensive dark theme overhaul #365
- FOUC prevention added in v0.18.0