Hi,
I’m trying to apply custom CSS to bokeh widgets displayed in a jupyter(lab) notebook. Motivation: Since bokeh ~3.4ish, widget font colors have not played nice with the jupyterlab dark theme - text often renders white on white background.
I’ve added a custom.css in the ~/.jupyter/config/custom
directory:
bokeh_widget {
font-weight: bold;
color: black;
}
Example ipynb with Widget:
import pandas as pd
from bokeh.layouts import row
from bokeh.models.widgets import Select
from bokeh.io import show, output_notebook
output_notebook()
months = list(pd.date_range(start='2024-01-01', periods=12,
freq='ME').strftime('%b'))
sel_month = Select(title='Select Month:', value='All',
options=['All']+months, css_classes=['bokeh_widget'])
def pl(doc):
doc.add_root(
row(sel_month)
)
return pl
show(pl)
Output with jupyterlab 4.3.5 & dark theme:
Unfortunately I know next to nothing about HTML & CSS - problem #1. Suspect/hope there’s an easy solution - patient guidance much appreciated
Thanks!