Correct way to bundle configuration and resources with a Panel app

Panel
1

As some of the frequent readers might know by now, I’m porting a Bokeh app to Panel.

The Bokeh app is directory-based, and includes a custom template, which in turn loads custom HTML. It also contains a theme.yaml that overrides some style properties on various elements.

I was surprised to find almost no documentation about directory based apps in Panel, or other documentation about how to include and load resources.

By trial and error I figured out that if I do exactly the same as Bokeh, it does load the custom template and CSS, but not my theme.yaml, which contains

attrs:
  InputWidget:
    default_size: 500
    css_classes: ["horizontal"]
  Box:
    spacing: 20
  Tabs:
    css_classes: ["mytabs"]
  Spacer:
    css_classes: ["spacer"]

Is there a way to configure such things in Panel?

And while on the topic of templates, I’m currently using a relative url that includes the name of the app which feels a bit dirty. Is there a jinja2 thing to refer to the url of resources?

[edit] Upon closer inspection it seems like it does load the theme.yaml, but ignores the default_size. What’s up with that? All the widgets have their default size of…300?

2

Setting min_width instead solved it. Does Panel do extra magic that overrides the Bokeh dimensions?

1 Like
3

In some scenarios it does. As for the directory based apps, we should absolutely document those. I’m extremely surprised the theme.yml doesn’t get loaded btw, it’s using the exact same code to load it as bokeh does. Seems like a bug that we should resolve.

4

In case you missed the edit: it does actually load the theme.yaml but the default_size property had no effect, leading me to think it wasn’t loaded at all.