bootstrap styles in export section

src/Bundle/ChillMainBundle/Resources/public/lib/export-list/export-list.scss

@@ -1,20 +0,0 @@
-.container-export {
-    margin-left: 1rem;
-    margin-right: 1rem;
-    
-    .export-list {
-        display: flex;
-        flex-direction: row;
-        flex-wrap: wrap;
-
-        .export-list__element {
-            min-width: 18rem;
-            max-width: 20rem;
-            padding: 1rem;
-            margin: 1rem;
-            flex-grow: 1;
-            
-            border: 1px solid var(--chill-gray);
-        }
-    }
-}

src/Bundle/ChillMainBundle/Resources/public/lib/export-list/index.js

@@ -1 +0,0 @@
-require('./export-list.scss');

src/Bundle/ChillMainBundle/Resources/views/Export/layout.html.twig

@@ -22,19 +22,18 @@
 
 
 {% block content %}
-<div class="container-export">
+    <div class="col-md-10">
-    <h1>{{ 'Exports list'|trans }}</h1>
+        <h1>{{ 'Exports list'|trans }}</h1>
-
+        
-        <div>
+        <div class="container mt-4">
             {% for group, exports in grouped_exports %}{%  if group != '_' %}
                 <h2>{{ group }}</h2>
                 
-                <div class="export-list">
+                <div class="row">
                     {% for export_alias, export in exports %}
-                    <div class="export-list__element">
+                    <div class="col-6 col-md-4 mb-3">
                         <h2>{{ export.title|trans }}</h2>
-                        <p>{{ export.description|trans }}</p> 
+                        <p>{{ export.description|trans }}</p>
-
                         <p>
                             <a class="btn btn-action" href="{{ path('chill_main_export_new', { 'alias': export_alias } ) }}">
                                 {{ 'Create an export'|trans }}
@@ -49,20 +48,24 @@
                 <h2>{{ 'Ungrouped exports'|trans }}</h2>
             {% endif %}
             
-            <div class="export-list">
+        </div>
-                {% for export_alias,export in grouped_exports['_'] %}    
+        <div class="container">
-                <div class="export-list__element">
+            
+            <div class="row">
+            {% for export_alias,export in grouped_exports['_'] %}
+                
+                <div class="col-6 col-md-4 mb-3">
                     <h2>{{ export.title|trans }}</h2>
-                    <p>{{ export.description|trans }}</p> 
+                    <p>{{ export.description|trans }}</p>
-
                     <p>
                         <a class="btn btn-action" href="{{ path('chill_main_export_new', { 'alias': export_alias } ) }}">
                             {{ 'Create an export'|trans }}
                         </a>
                     </p>
                 </div>
-                {% endfor %}
+                
+            {% endfor %}
             </div>
         </div>
-</div>
+    </div>
 {% endblock %}

src/Bundle/ChillMainBundle/Resources/views/Export/new.html.twig

@@ -103,6 +103,9 @@
         
         {% if form.children.export.children.export.children|length > 0 %}
         
+            <style>
+                div#export_export_fields { column-count: 2; }
+            </style>
             <section class="parameter">
                 <h2>
                     {{ 'Export parameters'|trans }}

src/Bundle/ChillMainBundle/Resources/views/Export/new_centers_step.html.twig

@@ -16,35 +16,43 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 #}
 
-{% extends "@ChillMain/layoutWithVerticalMenu.html.twig" %}
+{% extends "@ChillMain/layout.html.twig" %}
 
 {% block title %}{{ export.title|trans }}{% endblock %}
 
-{% block layout_wvm_content  %}
+{% block content %}
-    
+    <div class="col-md-10">
-    <h1>{{ export.title|trans }}</h1>
-    
-    <p>{{ export.description|trans }}</p>
-
-    {{ form_start(form) }}
-    
-    <h2>{{ 'Pick centers'|trans }}</h2>
-    
-    <p>{{ 'The export will contains only data from the picked centers.'|trans }} 
-        {{ 'This will eventually restrict your possibilities in filtering the data.'|trans }}</p>
-
-    {{ form_widget(form.centers.c) }}
-    
-    {% if form.centers.children.g is defined %}
         
-        <h3>{{ 'Pick aggregated centers'|trans }}</h3>
+        <h1>{{ export.title|trans }}</h1>
         
-        {% for f in form.centers.children.g.children %}
+        <p>{{ export.description|trans }}</p>
-        {{ form_row(f) }}
-        {% endfor %}
-    {% endif %}
     
-    <p>{{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-action btn-create' }, 'label' : 'Go to export options' } ) }}</p>
+        {{ form_start(form) }}
-    {{ form_end(form) }}
+        
+        <section class="center mb-4">
+            
+            <h2>{{ 'Pick centers'|trans }}</h2>
+            
+            <p>{{ 'The export will contains only data from the picked centers.'|trans }}
+                {{ 'This will eventually restrict your possibilities in filtering the data.'|trans }}</p>
+        
+            {{ form_widget(form.centers.c) }}
+            
+            {% if form.centers.children.g is defined %}
+                
+                <h3>{{ 'Pick aggregated centers'|trans }}</h3>
+                
+                {% for f in form.centers.children.g.children %}
+                    {{ form_row(f) }}
+                {% endfor %}
+                
+            {% endif %}
+            
+        </section>
+        
+        <p>{{ form_widget(form.submit, { 'attr' : { 'class' : 'btn btn-action btn-create' }, 'label' : 'Go to export options' } ) }}</p>
+        
+        {{ form_end(form) }}
     
-{% endblock layout_wvm_content  %}
+    </div>
+{% endblock content %}