From 15b572a959de1775d1807403fae80b2f9dc9a7a4 Mon Sep 17 00:00:00 2001
From: HWFord <lilypickle@hotmail.fr>
Date: Fri, 5 Mar 2021 09:06:46 +0100
Subject: [PATCH 1/3] =?UTF-8?q?Page=20donn=C3=A9es,=20changement=20de=20mi?=
 =?UTF-8?q?se=20en=20page=20all=C3=A9gement=20des=20fonctionnalit=C3=A9s?=
 =?UTF-8?q?=20en=20haut,=20quisont=20pass=C3=A9es=20dans=20le=20menu=20spe?=
 =?UTF-8?q?edin=20quelques=20changements=20de=20css=20pour=20mieux=20?=
 =?UTF-8?q?=C3=A9quilibrer?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/static/css/admin.css    | 67 ++++++++++++++++----------
 frontend/static/css/colors.css   |  4 +-
 frontend/static/css/composer.css |  8 ++--
 frontend/static/html/import.html |  4 +-
 frontend/static/js/admin.js      | 43 ++++++++++++++++-
 frontend/static/js/import.js     |  2 +-
 frontend/templates/admin.html    | 81 ++++++++++++++++++++------------
 7 files changed, 144 insertions(+), 65 deletions(-)

diff --git a/frontend/static/css/admin.css b/frontend/static/css/admin.css
index 8f4dd96..c7e8cfd 100644
--- a/frontend/static/css/admin.css
+++ b/frontend/static/css/admin.css
@@ -154,9 +154,9 @@ h5>.badge {
 
 
 .cards {
-  padding-left: 5px;
+  /*padding-left: 5px;*/
   padding-bottom: 15px;
-  padding-top: 5px;
+  padding-top: 15px;
 }
 
 .row {
@@ -167,12 +167,13 @@ h5>.badge {
 .sticky {
   z-index: 2;
   position: sticky;
-  top: 0;
+  top: 56px;
   /*background: white;
   box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);*/
-  padding: 10px;
+  padding: 15px 0;
   margin-right: 15px;
   margin-bottom: 15px;
+  background-color:rgba(233, 236, 239,0.7);
 }
 
 .sticky-sm {
@@ -203,11 +204,13 @@ h5>.badge {
 /*
   Cart css
 */
-#cd-cart.speed-in {
+#cd-cart.speed-in,
+#cd-filter.speed-in {
   right: 0;
 }
 
-#cd-cart {
+#cd-cart,
+#cd-filter {
   right: -100%;
   background: #fff;
   transition: right .6s;
@@ -215,19 +218,22 @@ h5>.badge {
 
 @media only screen and (min-width: 1200px) {
 
-  #cd-cart {
+  #cd-cart,
+  #cd-filter {
     width: 30%;
   }
 }
 
 @media only screen and (min-width: 768px) {
 
-  #cd-cart {
+  #cd-cart,
+  #cd-filter {
     width: 350px;
   }
 }
 
-#cd-cart {
+#cd-cart,
+#cd-filter {
   position: fixed;
   top: 56px;
   height: 100%;
@@ -237,7 +243,8 @@ h5>.badge {
   z-index: 3;
 }
 
-#cd-cart h2 {
+#cd-cart h2,
+#cd-filter h2 {
   font-size: 14px;
   font-size: .875rem;
   font-weight: 700;
@@ -246,12 +253,14 @@ h5>.badge {
 }
 
 @media only screen and (min-width: 1200px) {
-  #cd-cart>* {
+  #cd-cart>*,
+  #cd-filter>* {
     padding: 0 2em;
   }
 }
 
-#cd-cart>* {
+#cd-cart>*,
+#cd-filter>* {
   padding: 0 1em;
 }
 
@@ -260,12 +269,14 @@ h5>.badge {
 }
 
 @media only screen and (min-width: 1200px) {
-  #cd-cart>* {
+  #cd-cart>*,
+  #cd-filter>* {
     padding: 0 2em;
   }
 }
 
-#cd-cart>* {
+#cd-cart>*,
+  #cd-filter>* {
   padding: 0 1em;
 }
 
@@ -326,7 +337,8 @@ h5>.badge {
 /*
 * Toggle off cart icon
 */
-#togglePanier {
+#togglePanier,
+#toggleFilter {
   position: sticky;
   z-index: 5;
   width: 32px;
@@ -341,7 +353,8 @@ h5>.badge {
   padding:4px 36px;
 }
 
-#togglePanier:hover {
+#togglePanier:hover,
+#toggleFilter:hover {
   cursor: pointer;
   background-color: #FFA80E;
   transition: 0.3s;
@@ -350,10 +363,11 @@ h5>.badge {
 /*
 * Toggle on cart icon
 */
-.green {
+.green,
+#toggle-filter {
   color: #FFF;
   padding: 6px 12px 6px 12px;
-  border: 2px solid #999faf;
+  border: 2px solid #006878;
   color: #999faf;
   display: inline-block;
   position: relative;
@@ -361,21 +375,22 @@ h5>.badge {
 }
 
 .green .number {
-  padding: 2px 7px;
-  background: #999faf;
+  width:25px;
+  height:25px;
   position: absolute;
   border-radius: 50px;
   font-weight: 700;
-  font-size: 12px;
+  font-size: 15px;
   font-family: inherit;
-  color: #FFF;
-  top: -20px;
-  right: -20px;
+  color: black;
+  top: -15px;
+  right: -15px;
   margin:0;
-  border: 2px solid #FFF;
+  border: 0px;
 }
 
-.green:hover {
+.green:hover,
+#toggle-filter:hover {
   cursor: pointer;
   background: #006878 !important;
   color: #FFF !important;
diff --git a/frontend/static/css/colors.css b/frontend/static/css/colors.css
index a65c5fd..c864807 100644
--- a/frontend/static/css/colors.css
+++ b/frontend/static/css/colors.css
@@ -54,7 +54,7 @@
 
 /*Colors for color*/
 .mreport-primary-color-1{
-  color:#006878;
+  color:#006878!important;
 }
 
 .mreport-primary-color-2{
@@ -66,7 +66,7 @@
 }
 
 .mreport-secondary-color-1{
-  color:#FFA80E;
+  color:#FFA80E!important;
 }
 
 .mreport-secondary-color-2{
diff --git a/frontend/static/css/composer.css b/frontend/static/css/composer.css
index e36568f..172156b 100644
--- a/frontend/static/css/composer.css
+++ b/frontend/static/css/composer.css
@@ -558,13 +558,13 @@ span.text-edit.badge.mreport-secondary-color-2-bg{
 }
 
 span.designed-dataviz {
-    right: 30px;
-    position: absolute;
+    /*right: 30px;*/
+    /*position: absolute;*/
     font-family: "Font Awesome 5 Free";
-    font-size: 25px;
+    font-size: 20px;
     font-weight: 700;
     /*color: #218838;*/
-    margin-top: -10px;
+    /*margin-top: -10px;*/
 }
 
 span.designed-dataviz:before {
diff --git a/frontend/static/html/import.html b/frontend/static/html/import.html
index be0fdfb..b7188a6 100644
--- a/frontend/static/html/import.html
+++ b/frontend/static/html/import.html
@@ -1,7 +1,7 @@
 <!-- Button injected in admin.html-->
 <template id="import_button" data-target="#sticky">
-    <div class="col-md-2 col-12">
-        <button type="button" class="btn mreport-primary-color-1-bg" data-toggle="modal"
+    <div class="col-md-10 col-12 text-left">
+        <button type="button" class="btn mreport-primary-color-1-bg col-3" data-toggle="modal"
             data-target="#import-modal-form">Importer</button>
     </div>
 </template>
diff --git a/frontend/static/js/admin.js b/frontend/static/js/admin.js
index e00aab0..1e7d509 100644
--- a/frontend/static/js/admin.js
+++ b/frontend/static/js/admin.js
@@ -28,8 +28,17 @@ admin = (function () {
                 $("#" + $(this).attr("data-page")).addClass("active");
                 $(this).addClass("active");
                 if($(this).attr("data-page") == "reports" && $("#cd-cart").hasClass("speed-in") ||
-                   $(this).attr("data-page") =="composer" && $("#cd-cart").hasClass("speed-in")){
+                  $(this).attr("data-page") =="composer" && $("#cd-cart").hasClass("speed-in")||
+                  $(this).attr("data-page") =="home" && $("#cd-cart").hasClass("speed-in")){
                     $("#cd-cart").toggleClass("speed-in");
+                    $( "#catalog-content" ).css('margin-right','0');
+                    $( "#catalog-content" ).css('transition','margin-right .6s');
+                }else if($(this).attr("data-page") == "reports" && $("#cd-filter").hasClass("speed-in") ||
+                  $(this).attr("data-page") =="composer" && $("#cd-filter").hasClass("speed-in") ||
+                  $(this).attr("data-page") =="home" && $("#cd-filter").hasClass("speed-in")){
+                    $("#cd-filter").toggleClass("speed-in");
+                    $( "#catalog-content" ).css('margin-right','0');
+                    $( "#catalog-content" ).css('transition','margin-right .6s');
                 };
             });
         });
@@ -427,10 +436,42 @@ admin = (function () {
         /* Toggle the cart to appear */
         $(".green").click(function () {
             $("#cd-cart").toggleClass("speed-in");
+            $( "#catalog-content" ).css('margin-right','360px');
+            $( "#catalog-content" ).css('transition','margin-right .6s');
+          if($("#cd-filter").hasClass("speed-in")){
+            $("#cd-filter").toggleClass("speed-in");
+          }
+          if($("#cd-cart").hasClass("speed-in") == false){
+            $("#catalog-content" ).css('margin-right','0');
+            $("#catalog-content" ).css('transition','margin-right .6s');
+          }
         });
         /* Toggle the cart to disappear */
         $("#togglePanier").click(function () {
             $("#cd-cart").toggleClass("speed-in");
+            $( "#catalog-content" ).css('margin-right','0');
+            $( "#catalog-content" ).css('transition','margin-right .6s');
+        });
+
+
+        /* Toggle the filter to appear */
+        $("#toggle-filter").click(function () {
+            $("#cd-filter").toggleClass("speed-in");
+            $( "#catalog-content" ).css('margin-right','360px');
+            $( "#catalog-content" ).css('transition','margin-right .6s');
+          if($("#cd-cart").hasClass("speed-in")){
+            $("#cd-cart").toggleClass("speed-in");
+          }
+          if($("#cd-filter").hasClass("speed-in") == false){
+            $("#catalog-content" ).css('margin-right','0');
+            $("#catalog-content" ).css('transition','margin-right .6s');
+          } 
+        });
+        /* Toggle the filter to disappear */
+        $("#toggleFilter").click(function () {
+            $("#cd-filter").toggleClass("speed-in");
+            $("#catalog-content" ).css('margin-right','0');
+            $("#catalog-content" ).css('transition','margin-right .6s');
         });
 
     };
diff --git a/frontend/static/js/import.js b/frontend/static/js/import.js
index a910244..4f17815 100644
--- a/frontend/static/js/import.js
+++ b/frontend/static/js/import.js
@@ -251,7 +251,7 @@ import_wizard = (function () {
                _html.querySelectorAll("template").forEach(function(template) {
                     if (template.dataset.target) {
                         //inject import modal and button in admin.html
-                        document.querySelector(template.dataset.target).appendChild(template.content.firstElementChild);
+                        document.querySelector(template.dataset.target).prepend(template.content.firstElementChild);
                     }
 
                });
diff --git a/frontend/templates/admin.html b/frontend/templates/admin.html
index 82cf866..c46f645 100644
--- a/frontend/templates/admin.html
+++ b/frontend/templates/admin.html
@@ -93,7 +93,8 @@ <h1 class="mreport-grey-1">Mreport - Accueil</h1>
 
     <!-- Catalog start -->
     <div class="container-fluid page" id="catalog">
-        <h1>Données</h1>
+    <div id="catalog-content">
+        <h1 class="col-12">Données</h1>
         <div id="filterbutton" class="row sticky-sm">
             <button class="btn d-md-none col-12" data-toggle="collapse" data-target="#stickycollapse">
                 Outils<span class="glyphicon glyphicon-chevron-down" aria-hidden="true"></span>
@@ -101,29 +102,11 @@ <h1>Données</h1>
         </div>
         <div id="stickycollapse" class="collapse d-md-block sticky">
             <div id="sticky" class="row">
-                <div class="col-md-2 col-12">
-                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate" data-toggle="modal" data-report-state="new"
-                        data-target="#report-modal-form">Créer un rapport avec la sélection</button>
-                </div>
-                <div class="col-md-2 col-12">
-                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate" data-toggle="modal" data-report-state="add"
-                        data-target="#report-modal-form2">Ajouter à un rapport existant</button>
+                <div class="col-md-1 col-12 text-right p-0">
+                    <a class="green mreport-primary-color-1"><i class="fas fa-check-square"></i><span class="number mreport-secondary-color-1-bg">0</span></a>
                 </div>
-                <div class="col-md-2 col-12">
-                    <input id="searchbar" class="form-control" placeholder="Filtrer les données" maxlength="32">
-                </div>
-
-                <div class="col-md-1 col-12">
-                    <div class="custom-control custom-checkbox pt-2">
-                        <input type="checkbox" id="checkAll" class="custom-control-input" name="checkAll">
-                        <label class="custom-control-label" for="checkAll">Tout sélectionner</label>
-                    </div>
-                </div>
-                <div class="col-md-1 col-12">
-                    <a class="green"><i class="fas fa-shopping-bag"></i> <span class="number">0</span></a>
-                </div>
-                <div class="col-md-2 col-12">
-                     <button id="resetfilters" type="button" class="btn mreport-primary-color-2-bg "><i class="fas fa-undo"></i> Effacer le filtre</button>
+                <div class="col-md-1 col-12 text-right p-0">
+                    <a id="toggle-filter" class="mreport-primary-color-1"><i class="fas fa-filter"></i></a>
                 </div>
             </div>
         </div>
@@ -141,10 +124,17 @@ <h6 class="card-title">{{title}}</h6>
                                 <input type="checkbox" id="{{id}}-selection" class="dataviz-selection custom-control-input" name="dataviz-selection">
                                 <label class="custom-control-label" for="{{id}}-selection">Sélectionner</label>
                             </div>
-                            <a href="#" data-dataviz-state="edit" class="card-link mreport-primary-color-1" data-toggle="modal" data-related-id="{{id}}" data-target="#dataviz-modal-form"><i class="fas fa-pencil-alt mreport-secondary-color-1"></i> Editer</a>
-                            <a href="#" data-dataviz-state="delete" class="card-link mreport-primary-color-1" data-toggle="modal" data-related-id="{{id}}" data-target="#dataviz-modal-form"><i class="fas fa-trash mreport-secondary-color-1"></i> Supprimer</a>
-                            <span class="designed-dataviz {{designed}} mreport-secondary-color-2"  data-toggle="tooltip" data-html="true" title="Ces données ont une dataviz par défaut de configuré"></span>
-                            <span class="certified-dataviz {{certified}} mreport-secondary-color-2"   data-toggle="tooltip" data-html="true" title="cartified data"></span>
+                            <div class="row">
+                              <div class="col-md-9 p-0">
+                                <a href="#" data-dataviz-state="edit" class="col-12 card-link mreport-primary-color-1 p-0 d-inline-block" data-toggle="modal" data-related-id="{{id}}" data-target="#dataviz-modal-form"><i class="fas fa-pencil-alt mreport-secondary-color-1"></i> Editer</a>
+                                <a href="#" data-dataviz-state="delete" class="col-12 card-link mreport-primary-color-1 p-0 m-0 d-inline-block" data-toggle="modal" data-related-id="{{id}}" data-target="#dataviz-modal-form"><i class="fas fa-trash mreport-secondary-color-1"></i> Supprimer</a>
+                              </div>
+                              <div class="col-md-3 p-0 text-right">
+                                <span class="designed-dataviz {{designed}} mreport-secondary-color-2"  data-toggle="tooltip" data-html="true" title="Ces données ont une dataviz par défaut de configuré"></span>
+                                <span class="certified-dataviz {{certified}} mreport-secondary-color-2"   data-toggle="tooltip" data-html="true" title="cartified data"></span>
+                              </div>
+                            </div>
+                            
                         </div>
                         <div class="card-footer">Usages: </div>
                     </div>
@@ -155,11 +145,12 @@ <h6 class="card-title">{{title}}</h6>
 
         </div>
     </div>
+    </div>
     <!-- Catalog start -->
 
     <!-- Reports start -->
     <div class="container-fluid page" id="reports">
-        <h1>Rapports</h1>
+        <h1 class="col-12">Rapports</h1>
     </div>
     <!-- Reports start -->
 
@@ -429,11 +420,43 @@ <h5 class="modal-title" id="exampleModalLabel">Edition</h5>
     <!-- Cart -->
     <div id="cd-cart">
         <a id="togglePanier" class="mreport-primary-color-1-bg">Fermer</a>
+                <div class="col-12">
+                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12 mt-3" data-toggle="modal" data-report-state="new"
+                        data-target="#report-modal-form">Créer un rapport avec la sélection</button>
+                </div>
+                <div class="col-12">
+                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12 mt-3" data-toggle="modal" data-report-state="add"
+                        data-target="#report-modal-form2">Ajouter à un rapport existant</button>
+                </div>
+                <div class="col-12">
+                    <div class="custom-control custom-checkbox pt-2">
+                        <input type="checkbox" id="checkAll" class="custom-control-input" name="checkAll">
+                        <label class="custom-control-label" for="checkAll">Tout sélectionner</label>
+                    </div>
+                </div>
         <h2>Selection</h2>
         <ul class="cd-cart-items">
-
         </ul>
     </div>
+
+    <!-- Filter -->
+    <div id="cd-filter">
+        <a id="toggleFilter" class="mreport-primary-color-1-bg">Fermer</a>
+        <div class="row">
+          <div class="col-md-6 col-12 p-0">
+            <h2 class="">Filtrer</h2>
+          </div>
+          <div class="col-md-6 col-12 text-right p-0">
+            <button id="resetfilters" type="button" class="btn mreport-primary-color-2-bg "><i class="fas fa-undo"></i> Réinitialiser</button>
+          </div>
+        </div>
+        
+
+          <div class="col-md-12 col-12">
+            <input id="searchbar" class="form-control" placeholder="Filtrer les données" maxlength="32">
+          </div>
+    </div>
+
     <!-- Structure dividing modal -->
     <div class="modal fade" id="divide_form" tabindex="-1" role="dialog" aria-labelledby="divideForm"
         aria-hidden="true">

From 86ff359245e4a379691b45ea63a16878ae7af312 Mon Sep 17 00:00:00 2001
From: HWFord <lilypickle@hotmail.fr>
Date: Fri, 5 Mar 2021 10:59:45 +0100
Subject: [PATCH 2/3] bouge le filtre dans le slide in du panier enleve le
 toggle filter

---
 frontend/static/css/admin.css    | 73 +++++++++++++++++---------------
 frontend/static/html/import.html |  6 +--
 frontend/static/js/admin.js      | 30 -------------
 frontend/templates/admin.html    | 72 +++++++++++++++----------------
 4 files changed, 77 insertions(+), 104 deletions(-)

diff --git a/frontend/static/css/admin.css b/frontend/static/css/admin.css
index c7e8cfd..383f529 100644
--- a/frontend/static/css/admin.css
+++ b/frontend/static/css/admin.css
@@ -176,6 +176,15 @@ h5>.badge {
   background-color:rgba(233, 236, 239,0.7);
 }
 
+#cd-cart .sticky{
+  background-color:white;
+  top:30px;
+  padding:15px;
+  margin:0px;
+  margin-top:-10px;
+  background-color:rgba(233, 236, 239,0.9);
+}
+
 .sticky-sm {
   z-index: 2;
   position: sticky;
@@ -204,13 +213,11 @@ h5>.badge {
 /*
   Cart css
 */
-#cd-cart.speed-in,
-#cd-filter.speed-in {
+#cd-cart.speed-in {
   right: 0;
 }
 
-#cd-cart,
-#cd-filter {
+#cd-cart {
   right: -100%;
   background: #fff;
   transition: right .6s;
@@ -218,22 +225,19 @@ h5>.badge {
 
 @media only screen and (min-width: 1200px) {
 
-  #cd-cart,
-  #cd-filter {
+  #cd-cart {
     width: 30%;
   }
 }
 
 @media only screen and (min-width: 768px) {
 
-  #cd-cart,
-  #cd-filter {
+  #cd-cart {
     width: 350px;
   }
 }
 
-#cd-cart,
-#cd-filter {
+#cd-cart {
   position: fixed;
   top: 56px;
   height: 100%;
@@ -243,8 +247,7 @@ h5>.badge {
   z-index: 3;
 }
 
-#cd-cart h2,
-#cd-filter h2 {
+#cd-cart h2 {
   font-size: 14px;
   font-size: .875rem;
   font-weight: 700;
@@ -253,14 +256,12 @@ h5>.badge {
 }
 
 @media only screen and (min-width: 1200px) {
-  #cd-cart>*,
-  #cd-filter>* {
+  #cd-cart>* {
     padding: 0 2em;
   }
 }
 
-#cd-cart>*,
-#cd-filter>* {
+#cd-cart>* {
   padding: 0 1em;
 }
 
@@ -268,15 +269,23 @@ h5>.badge {
   padding: 0;
 }
 
+#cd-cart .cd-cart-items h6.card-title {
+  font-size:12px;
+  padding:0;
+  margin:0;
+}
+
+#cd-cart .cd-cart-items #catalog .badge, .cd-cart-items .badge{
+  display:none;
+}
+
 @media only screen and (min-width: 1200px) {
-  #cd-cart>*,
-  #cd-filter>* {
+  #cd-cart>* {
     padding: 0 2em;
   }
 }
 
-#cd-cart>*,
-  #cd-filter>* {
+#cd-cart>*{
   padding: 0 1em;
 }
 
@@ -337,8 +346,7 @@ h5>.badge {
 /*
 * Toggle off cart icon
 */
-#togglePanier,
-#toggleFilter {
+#togglePanier {
   position: sticky;
   z-index: 5;
   width: 32px;
@@ -353,8 +361,7 @@ h5>.badge {
   padding:4px 36px;
 }
 
-#togglePanier:hover,
-#toggleFilter:hover {
+#togglePanier:hover {
   cursor: pointer;
   background-color: #FFA80E;
   transition: 0.3s;
@@ -363,13 +370,12 @@ h5>.badge {
 /*
 * Toggle on cart icon
 */
-.green,
-#toggle-filter {
+.green{
   color: #FFF;
   padding: 6px 12px 6px 12px;
-  border: 2px solid #006878;
+  /*border: 2px solid #006878;*/
   color: #999faf;
-  display: inline-block;
+  /*display: inline-block;*/
   position: relative;
   transition: .4s;
 }
@@ -383,18 +389,17 @@ h5>.badge {
   font-size: 15px;
   font-family: inherit;
   color: black;
-  top: -15px;
-  right: -15px;
+  top: -10px;
+  right: -10px;
   margin:0;
   border: 0px;
 }
 
-.green:hover,
-#toggle-filter:hover {
+.green:hover {
   cursor: pointer;
-  background: #006878 !important;
+  /*background: #006878 !important;*/
   color: #FFF !important;
-  border: 2px solid #006878;
+  /*border: 2px solid #006878;*/
   transition: 0.4s;
 }
 #wizard-result{
diff --git a/frontend/static/html/import.html b/frontend/static/html/import.html
index b7188a6..d2311a7 100644
--- a/frontend/static/html/import.html
+++ b/frontend/static/html/import.html
@@ -1,8 +1,8 @@
 <!-- Button injected in admin.html-->
 <template id="import_button" data-target="#sticky">
-    <div class="col-md-10 col-12 text-left">
-        <button type="button" class="btn mreport-primary-color-1-bg col-3" data-toggle="modal"
-            data-target="#import-modal-form">Importer</button>
+    <div class="col-md-6 col-12 text-left">
+        <button type="button" class="btn mreport-primary-color-3-bg col-3" data-toggle="modal"
+            data-target="#import-modal-form"><i class="fas fa-file-import"></i> Importer</button>
     </div>
 </template>
 
diff --git a/frontend/static/js/admin.js b/frontend/static/js/admin.js
index 1e7d509..b7a76f0 100644
--- a/frontend/static/js/admin.js
+++ b/frontend/static/js/admin.js
@@ -33,12 +33,6 @@ admin = (function () {
                     $("#cd-cart").toggleClass("speed-in");
                     $( "#catalog-content" ).css('margin-right','0');
                     $( "#catalog-content" ).css('transition','margin-right .6s');
-                }else if($(this).attr("data-page") == "reports" && $("#cd-filter").hasClass("speed-in") ||
-                  $(this).attr("data-page") =="composer" && $("#cd-filter").hasClass("speed-in") ||
-                  $(this).attr("data-page") =="home" && $("#cd-filter").hasClass("speed-in")){
-                    $("#cd-filter").toggleClass("speed-in");
-                    $( "#catalog-content" ).css('margin-right','0');
-                    $( "#catalog-content" ).css('transition','margin-right .6s');
                 };
             });
         });
@@ -438,9 +432,6 @@ admin = (function () {
             $("#cd-cart").toggleClass("speed-in");
             $( "#catalog-content" ).css('margin-right','360px');
             $( "#catalog-content" ).css('transition','margin-right .6s');
-          if($("#cd-filter").hasClass("speed-in")){
-            $("#cd-filter").toggleClass("speed-in");
-          }
           if($("#cd-cart").hasClass("speed-in") == false){
             $("#catalog-content" ).css('margin-right','0');
             $("#catalog-content" ).css('transition','margin-right .6s');
@@ -453,27 +444,6 @@ admin = (function () {
             $( "#catalog-content" ).css('transition','margin-right .6s');
         });
 
-
-        /* Toggle the filter to appear */
-        $("#toggle-filter").click(function () {
-            $("#cd-filter").toggleClass("speed-in");
-            $( "#catalog-content" ).css('margin-right','360px');
-            $( "#catalog-content" ).css('transition','margin-right .6s');
-          if($("#cd-cart").hasClass("speed-in")){
-            $("#cd-cart").toggleClass("speed-in");
-          }
-          if($("#cd-filter").hasClass("speed-in") == false){
-            $("#catalog-content" ).css('margin-right','0');
-            $("#catalog-content" ).css('transition','margin-right .6s');
-          } 
-        });
-        /* Toggle the filter to disappear */
-        $("#toggleFilter").click(function () {
-            $("#cd-filter").toggleClass("speed-in");
-            $("#catalog-content" ).css('margin-right','0');
-            $("#catalog-content" ).css('transition','margin-right .6s');
-        });
-
     };
 
     _addDatavizToReport = function (report_id, report_data) {
diff --git a/frontend/templates/admin.html b/frontend/templates/admin.html
index c46f645..8c35e01 100644
--- a/frontend/templates/admin.html
+++ b/frontend/templates/admin.html
@@ -102,12 +102,13 @@ <h1 class="col-12">Données</h1>
         </div>
         <div id="stickycollapse" class="collapse d-md-block sticky">
             <div id="sticky" class="row">
-                <div class="col-md-1 col-12 text-right p-0">
-                    <a class="green mreport-primary-color-1"><i class="fas fa-check-square"></i><span class="number mreport-secondary-color-1-bg">0</span></a>
-                </div>
-                <div class="col-md-1 col-12 text-right p-0">
-                    <a id="toggle-filter" class="mreport-primary-color-1"><i class="fas fa-filter"></i></a>
-                </div>
+              <div class="col-md-6 col-12 text-right">
+                <a class="green">
+                  <button type="button" class="btn mreport-primary-color-1-bg col-4">
+                    <i class="fas fa-check-square"></i><span class="number mreport-secondary-color-1-bg">0</span>
+                  Séléctionner</button>
+                </a> 
+              </div>
             </div>
         </div>
         <div id="dataviz-cards" class="row">
@@ -420,43 +421,40 @@ <h5 class="modal-title" id="exampleModalLabel">Edition</h5>
     <!-- Cart -->
     <div id="cd-cart">
         <a id="togglePanier" class="mreport-primary-color-1-bg">Fermer</a>
-                <div class="col-12">
-                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12 mt-3" data-toggle="modal" data-report-state="new"
-                        data-target="#report-modal-form">Créer un rapport avec la sélection</button>
-                </div>
-                <div class="col-12">
-                    <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12 mt-3" data-toggle="modal" data-report-state="add"
-                        data-target="#report-modal-form2">Ajouter à un rapport existant</button>
-                </div>
-                <div class="col-12">
-                    <div class="custom-control custom-checkbox pt-2">
-                        <input type="checkbox" id="checkAll" class="custom-control-input" name="checkAll">
-                        <label class="custom-control-label" for="checkAll">Tout sélectionner</label>
-                    </div>
-                </div>
-        <h2>Selection</h2>
-        <ul class="cd-cart-items">
-        </ul>
-    </div>
-
-    <!-- Filter -->
-    <div id="cd-filter">
-        <a id="toggleFilter" class="mreport-primary-color-1-bg">Fermer</a>
-        <div class="row">
-          <div class="col-md-6 col-12 p-0">
-            <h2 class="">Filtrer</h2>
-          </div>
-          <div class="col-md-6 col-12 text-right p-0">
-            <button id="resetfilters" type="button" class="btn mreport-primary-color-2-bg "><i class="fas fa-undo"></i> Réinitialiser</button>
+        <div class="sticky">
+          <div class="row">
+            <div class="col-md-6 col-12 p-0">
+              <h2 class="">Filtrer</h2>
+            </div>
+            <div class="col-md-6 col-12 text-right p-0">
+              <button id="resetfilters" type="button" class="btn mreport-secondary-color-2-bg "><i class="fas fa-undo"></i> Réinitialiser</button>
+            </div>
           </div>
-        </div>
-        
-
           <div class="col-md-12 col-12">
             <input id="searchbar" class="form-control" placeholder="Filtrer les données" maxlength="32">
           </div>
+          <h2>Selection</h2>
+          <div class="col-12">
+            <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12" data-toggle="modal" data-report-state="new"
+              data-target="#report-modal-form">Créer un rapport avec la sélection</button>
+          </div>
+          <div class="col-12">
+            <button type="button" class="btn mreport-primary-color-2-bg toggle-deactivate col-12 mt-3" data-toggle="modal" data-report-state="add"
+              data-target="#report-modal-form2">Ajouter à un rapport existant</button>
+          </div>
+          <div class="col-12">
+            <div class="custom-control custom-checkbox mt-3">
+              <input type="checkbox" id="checkAll" class="custom-control-input" name="checkAll">
+              <label class="custom-control-label" for="checkAll">Tout sélectionner</label>
+            </div>
+          </div>
+          
+        </div>
+        <ul class="cd-cart-items">
+        </ul>
     </div>
 
+
     <!-- Structure dividing modal -->
     <div class="modal fade" id="divide_form" tabindex="-1" role="dialog" aria-labelledby="divideForm"
         aria-hidden="true">

From 4cdb0375716afbdad48bd7ddd3ceea9f631a4eaf Mon Sep 17 00:00:00 2001
From: HWFord <lilypickle@hotmail.fr>
Date: Fri, 5 Mar 2021 11:09:53 +0100
Subject: [PATCH 3/3] =?UTF-8?q?cache=20badge=20secondaire=20page=20donn?=
 =?UTF-8?q?=C3=A9es?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/static/css/admin.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/static/css/admin.css b/frontend/static/css/admin.css
index 383f529..406ad2b 100644
--- a/frontend/static/css/admin.css
+++ b/frontend/static/css/admin.css
@@ -275,7 +275,8 @@ h5>.badge {
   margin:0;
 }
 
-#cd-cart .cd-cart-items #catalog .badge, .cd-cart-items .badge{
+.cd-cart-items .badge,
+#catalog .badge.badge-secondary{
   display:none;
 }