voila-dashboards / voila

Voilà turns Jupyter notebooks into standalone web applications
https://voila.readthedocs.io
Other
5.31k stars 497 forks source link

Disambiguate voilà frontend via html data attributes #1457

Closed timkpaine closed 2 months ago

timkpaine commented 3 months ago

References

https://github.com/finos/perspective/pull/2588 https://github.com/finos/perspective/pull/2352 https://github.com/finos/perspective/issues/1773

Code changes

This PR fixes Perspective, and maybe some other plugins. But more importantly: "if one is going to distinguish behavior that is specific to Voila, it can't share classnames with Jupyter." One should be able to differentiate voilà-specific behavior, since there are legimate, often subtle UI/UX differences with Lab/Notebook.

User-facing changes

This adds some very basic html data attributes to the top level html body, namely data-in-voila. I don't think it matters what this string actually is, merely that it is present and unique to voilà. This attribute will allow extensions to differentiate the voilà frontend in what is, imo, a minimally invasive way.

Backwards-incompatible changes

None!

github-actions[bot] commented 3 months ago

Binder :point_left: Launch a Binder on branch timkpaine/voila/tkp/cssselector

trungleduc commented 3 months ago

Hi @timkpaine, IIUC you want to create plugins targeting only Voila? In this case, you can check for app.name ==='Voila' in the activation function.

timkpaine commented 3 months ago

In this case, you can check for app.name ==='Voila' in the activation function.

I would like to tweak visual behavior in voilà, independent from lab/notebook. Since the behavior is visual, it is via css rules. So ideally a pure-css solution would be in place.

trungleduc commented 2 months ago

Thanks @timkpaine