Material design bootstrap extended panel like in Google Form

Question

I am developing app in Django and using bootstrap with Material Design CSS and JS

I am looking for easy way to imitate behaviour of the google forms page

So I am looking for a way, that you have a table row (or a div) and on click this row or div extend, add new elements and buttons on it and raise it with left color decoration.

I kind off make this, but the procedure is not so simple and it is not made as "template" to use it on different pages, projects,...

Because it seams to me, that this behaviour is standard in Google products, I am asking if there is some standard/easy procedure for achieving this.

Answer 1

You should be able to do it with Django Crispy Forms (http://django-crispy-forms.readthedocs.io/en/latest/layouts.html) using CRISPY_TEMPLATE_PACK = 'bootstrap4' in your settings and plugging needed CSS and JS.