django-plotly-dash icon indicating copy to clipboard operation
django-plotly-dash copied to clipboard

bootstrap 5 compatibility

Open folmerkrikken opened this issue 4 years ago • 2 comments

Hi, thanks for this great application!

I've been playing with the new pre-release of dash-bootstrap-components v1 (switch to bootstrap 5) and was wondering if I could already use this in combination with django-plotly-dash. The documentation specifically mentions bootstrap 4, so I'm wondering if I could just change all 4's to 5's in the mentioned steps needed to include bootstrap in my apps. I've noticed dpd-static-support also uses bootstrap 4. Could this be an issue when changing to bootstrap 5?

Thanks, Folmer Krikken

folmerkrikken avatar Oct 01 '21 09:10 folmerkrikken

I suspect that at the moment you'll get a mix of bootstrap 4 and 5 being used. If you are in a position to try it and report what you find, that would be great, but any issues will be feature requests rather than bugs.

Is bootstrap 5 backwards compatible with bootstrap 4?

delsim avatar Oct 02 '21 16:10 delsim

In the meantime I indeed tested it and now I have a dash application running on www.climateradar.com/tools/clim_analyzer using the pre-release dash-bootstrap-components v1. It seems to work quite well. I've tried to add some specific v1 components (accordion and offcanvas) and they worked okay. I did have some callbacks that stopped working for which I needed a work around. This might be related to a mix of bootstrap 4 with bootstrap 5 but I'm not sure on this. In order to get it working I installed django-bootstrap-v5 and the pre-release of dash-bootstrap-components v1. I had to change from bootstrap4.bootstrap import css_url to from bootstrap5.bootstrap import css_url in the file dash_wrapper.py. In my settings.py I've added bootstrap5 to INSTALLED_APPS and removed dash_renderer, dash_core_components and dash_html_components from the PLOTLY_COMPONENTS and added dash. Not sure if the latter is needed, but with Dash V2 the removed components are now part of Dash.

Concerning dash-bootstrap-components there are unfortunately quite some breaking changes (https://dbc-v1.herokuapp.com/migration-guide/) so I needed to change quite a bit of code. Mainly because I was using a lot of block buttons which is no longer supported with the block keyword. But the new release has quite some nice features so it seems to be worth it.

folmerkrikken avatar Oct 04 '21 12:10 folmerkrikken