Merge pull request #725 from sgmap/improve_procedure_logo

Improve procedure logo

app/assets/stylesheets/new_design/procedure-logo.scss

@@ -0,0 +1,17 @@
+@import "colors";
+@import "constants";
+
+.procedure-logo {
+  display: flex;
+  background: #FFFFFF;
+  border: 1px solid $border-grey;
+  height: 84px;
+  width: 84px;
+  margin-right: 2 * $default-spacer;
+
+  img {
+    margin: auto;
+    max-width: 80%;
+    max-height: 80%;
+  }
+}

app/assets/stylesheets/new_design/procedure_list.scss

@@ -26,16 +26,15 @@
   }
 
   .procedure-logo {
-    margin-right: 16px;
-    width: 40px;
-    border-bottom: 1px solid $border-grey;
+    height: 93px;
+    width: 93px;
+    margin-right: 3 * $default-spacer;
   }
 
   .procedure-title {
     min-height: 40px;
     font-size: 20px;
     margin-bottom: 16px;
-    padding-left: $default-spacer;
   }
 
   .procedure-status {

app/views/new_gestionnaire/procedures/index.html.haml

@@ -5,11 +5,15 @@
     - @procedures.each do |p|
       %li.procedure-item.flex.align-start
         = link_to(procedure_path(p)) do
+          .flex
+
+            .procedure-logo
+              - if p.logo.present?
+                = image_tag p.logo, alt: "Logo de la procédure"
+
             .procedure-details
               %p.procedure-title
-              - if p.logo.present?
-                = image_tag p.logo, class: "procedure-logo"
-              #{p.libelle}
+                = p.libelle
 
               %ul.procedure-stats.flex
                 %li

app/views/new_gestionnaire/procedures/show.html.haml

@@ -1,10 +1,12 @@
 #procedure-show
   .backoffice-header
     .container.flex
-      - if @procedure.logo.present?
-        = image_tag @procedure.logo, height: 40, class: 'procedure-logo'
 
-      .width-100
+      .procedure-logo
+        - if @procedure.logo.present?
+          = image_tag @procedure.logo, alt: "Logo de la procédure"
+
+      .procedure-header
         %h1= @procedure.libelle
         %ul.tabs
           %li{ class: (@statut == 'a-suivre') ? 'active' : nil }>