From 1f3dd00d815520dab82d4e2cb4db23fdd5e01599 Mon Sep 17 00:00:00 2001
From: Mathieu Jaumotte <mathieu.jaumotte@champs-libres.coop>
Date: Mon, 14 Nov 2022 12:31:13 +0100
Subject: [PATCH] improve flex positionning for list exports cards

---
 .../Resources/public/chill/chillmain.scss     | 14 +++++++----
 .../Resources/views/Export/layout.html.twig   | 24 +++++++++----------
 2 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
index 5c302bf83..7cd3f5479 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
+++ b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss
@@ -518,8 +518,14 @@ div.v-toast {
    z-index: 10000!important;
 }
 
-div.grouped {
-    padding: 1em;
-    border: 1px solid black;
-    margin-bottom: 2em;
+// export index page
+div.exports-list {
+    div.flex-bloc .item-bloc {
+        flex-basis: 33%;
+        @include media-breakpoint-down(lg) { flex-basis: 50%; }
+        @include media-breakpoint-down(sm) { flex-basis: 100%; }
+        p:last-child {
+            margin-top: auto;
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/Bundle/ChillMainBundle/Resources/views/Export/layout.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Export/layout.html.twig
index 5ce433535..b86f617b4 100644
--- a/src/Bundle/ChillMainBundle/Resources/views/Export/layout.html.twig
+++ b/src/Bundle/ChillMainBundle/Resources/views/Export/layout.html.twig
@@ -25,25 +25,23 @@
 
     {{ include('@ChillMain/Export/_navbar.html.twig', {'current' : 'common'}) }}
 
-    <div class="col-md-10">
+    <div class="col-md-10 exports-list">
 
         <div class="container mt-4">
             
             {% for group, exports in grouped_exports %}{%  if group != '_' %}
                 <h2 class="display-6">{{ group|trans }}</h2>
-                <div class="row grouped">
+                <div class="row flex-bloc">
                     {% for export_alias, export in exports %}
-                    <div class="col-6 col-md-4 mb-3">
-                        <div class="card">
-                            <div class="card-body">
-                                <h2 class="card-title">{{ export.title|trans }}</h2>
-                                <p class="card-text">{{ 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>
+                    <div class="item-bloc">
+                        <div class="item-row card-body">
+                            <h2 class="card-title">{{ export.title|trans }}</h2>
+                            <p class="card-text my-3">{{ 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>
                     </div>
                     {% endfor %}