Custom themes in default templates

[guigoruiz1]

Hello,

I have a suggestion for you. It would be really great if there was a way to include custom themes in the default templates. For example, the lab template comes with light and dark themes. I have created a "dynamic" theme that sets either dark or light themes based on a media query to get the user's preferred mode. It also inverts svg images so that embedded matplotlib plots match the theme of the page. However, with the current structure, I cannot add it as a third theme to the lab template in a clean way. Even though the lab template has this code block

{% block notebook_css %}
{{ resources.include_css("static/index.css") }}
{% if resources.theme == 'dark' %}
    {{ resources.include_css("static/theme-dark.css") }}
{% elif resources.theme == 'light'  %}
    {{ resources.include_css("static/theme-light.css") }}
{% else %}
    {{ resources.include_lab_theme(resources.theme) }}
{% endif %}

the find_lab_theme doesn't look at the "right" place for other themes. So, if I put a new CSS into the static folder, I cannot use it, as find_lab_theme searches some labextension folders instead.

I know that I can simply create a new template. I've done that, but several other extensions, such as voila, will use the lab template and its themes as default. That makes it super annoying to be unable to apply my dynamic theme to the voila gridstack template, for example. Again, I could create a custom voila girdstack with a dynamic theme, but that is yet another template.

So, my suggestion is: can we have a way to add a custom theme (CSS) to the default templates and choose it with, for example --theme=dynamic?

If that's already possible and I wasn't aware, my apologies. Otherise, I'm open for suggestions.

Moreover, it would be very nice if you had a built-in dynamic theme. It's not hard to do and, nowadays, most people like to use dynamic colors.

Thank you