Summary
Allow pairing two color schemes (one light, one dark) and automatically switch between them based on prefers-color-scheme and/or the site theme's dark-mode toggle.
Details
- New settings: light-mode theme + dark-mode theme (falling back to the current single
color_scheme setting when unset).
- Load both theme stylesheets scoped via
@media (prefers-color-scheme: ...) or a data-theme/class hook, with a filter (e.g. wzcbh_dark_mode_selector) so themes with custom toggles can integrate.
- Applies to both client (Prism.js) and server (highlight.php) modes since both share the same Prism theme CSS via
Settings::get_color_scheme_css().
- Editor canvas styles (
enqueue_editor_canvas_styles()) should respect the current editor scheme.
Why
Most modern sites offer dark mode; a fixed code theme clashes with one of the two modes. This is a top differentiator among syntax highlighting plugins.
Speed to implement: Medium · Usefulness: Very High · Rank: 1
Summary
Allow pairing two color schemes (one light, one dark) and automatically switch between them based on
prefers-color-schemeand/or the site theme's dark-mode toggle.Details
color_schemesetting when unset).@media (prefers-color-scheme: ...)or adata-theme/class hook, with a filter (e.g.wzcbh_dark_mode_selector) so themes with custom toggles can integrate.Settings::get_color_scheme_css().enqueue_editor_canvas_styles()) should respect the current editor scheme.Why
Most modern sites offer dark mode; a fixed code theme clashes with one of the two modes. This is a top differentiator among syntax highlighting plugins.
Speed to implement: Medium · Usefulness: Very High · Rank: 1