Panel-Material-UI pmui.Page and Bokeh figure properties

Panel
1

Hi everybody,

I have been using panel for quite a while now and wrote several applications using it.
I recently found out about Panel-Material-UI and am now trying to update those apps, however, I have been running into problems using pmui.Page and trying to configure certain Bokeh figure properties.
For example trying to set the background color (of the figure to black) with the following code (python -m panel serve test.py --show --autoreload):

import panel as pn
import panel_material_ui as pmui
from bokeh.plotting import figure

HEADER_COLOR = "#0066FF"
PAPER_COLOR = "#FFFFFF"
FIGURE_BACKGROUND_COLOR = "#000000"

THEME_CONFIG = {
    'palette': {
        'primary': {
            'main': HEADER_COLOR # The header is styled by the primary palette
        },
        'background': {
            'paper': PAPER_COLOR, # The remaining areas are paper colored
        },
    }
}

x = [1,2,3,4,5]
y = [6,7,2,4,5]

p = figure(title="Sample Plot")
line = p.line(x, y)
p.background_fill_color = FIGURE_BACKGROUND_COLOR

plt = pmui.Container(p)

pmui.Page(
    main=[plt],
    theme_config=THEME_CONFIG,
).servable()

yields the following result:

image
image1905×921 21.4 KB

I.e. the background color remains equivalent to the “palette.background.paper”-Property (white). It seems like the css of Bokeh is overwritten by the pmui.Paper properties/css. I suspect this behaviour can be modified, however, my css-skills were not good enough to identify what properties of the bokeh figure need to be changed. Any help would be appreciated

In case this behaviour is an actual error, I am using the following versions:

panel==1.8.5
bokeh==3.8.1
panel-material-ui==0.8.0

Best redards