impact output background if dark mode activated

[LuisBL]

Hello, First things first: Thank you for this fantastic module.

I use jupyter-sphinx with furo theme. When dark mode is activated doesn't look good

What is the recommended way to go ?

[akhmerov]

Thanks!

I fear the only way forward is to identify which part of the css breaks inheritance and to fix that. I'm not good with CSS myself, so not sure when I'll have time for this.

[sjrowlinson]

I encountered a similar issue recently whilst using the pydata-sphinx-theme. Adding the following overrides:

html[data-theme="dark"] .bd-content div.cell_output .text_html,
html[data-theme="dark"] .bd-content div.cell_output img {
    background-color: var(--pst-color-background);
    color: var(--pst-color-text-base);
}

to my custom CSS file (in my case, in docs/source/_static/<projectname>.css) seemed to work for me. Note that this will set the background color of these cell outputs to the corresponding dark theme background, but you can set it to the color of literal blocks if you want with this instead:

background-color: var(--pst-color-surface);

[12rambau]

I'm a maintainer of the pydata-sphinx-theme; this problem should be solved from the themes themselves as they override most of the CSS. Also for the specific issue of dark theme, there is no guarantee that all themes will use the same CSS selectors to split their light and dark styles (in this case it's a "data-theme" member on the html tag) making it even less reliable if we make changes from here.

If the problem continues, I would suggest you open an issue on the furo theme directly or use the custom css proposed by @sjrowlinson.