Add procedure overview on login

app/assets/images/flag_of_europe.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="810" height="540"><desc>European flag</desc><defs><g id="d"><g id="b"><path id="a" d="M0 0v1h.5z" transform="rotate(18 3.157 -.5)"/><use xlink:href="#a" transform="scale(-1 1)"/></g><g id="c"><use xlink:href="#b" transform="rotate(72)"/><use xlink:href="#b" transform="rotate(144)"/></g><use xlink:href="#c" transform="scale(-1 1)"/></g></defs><path fill="#039" d="M0 0h810v540H0z"/><g fill="#fc0" transform="matrix(30 0 0 30 405 270)"><use xlink:href="#d" y="-6"/><use xlink:href="#d" y="6"/><g id="e"><use xlink:href="#d" x="-6"/><use xlink:href="#d" transform="rotate(-144 -2.344 -2.11)"/><use xlink:href="#d" transform="rotate(144 -2.11 -2.344)"/><use xlink:href="#d" transform="rotate(72 -4.663 -2.076)"/><use xlink:href="#d" transform="rotate(72 -5.076 .534)"/></g><use xlink:href="#e" transform="scale(-1 1)"/></g></svg>

app/assets/stylesheets/new_design/login.scss

@@ -49,7 +49,7 @@ $login-padding: 60px;
 .preview {
   font-size: 24px;
 
-  img {
+  .paperless-logo {
     width: 100%;
     margin-bottom: 60px;
   }
@@ -58,6 +58,29 @@ $login-padding: 60px;
     color: $blue;
     font-weight: bold;
   }
+
+  .close-procedure {
+    font-size: 12px;
+  }
+
+  .procedure-title {
+    font-size: 30px;
+    margin: 50px 0 32px;
+  }
+
+  .procedure-description {
+    font-size: 14px;
+  }
+
+  .procedure-logos {
+    display: flex;
+    justify-content: space-around;
+
+    img {
+      max-height: 130px;
+      margin: 0 10px;
+    }
+  }
 }
 
 .login-form {

app/views/users/sessions/new.html.haml

@@ -1,13 +1,27 @@
 .two-columns
   .login-wrapper
     .preview
-      = image_tag "landing/hero/dematerialiser.svg"
+      - unless @dossier
-      .baseline.center
+        = image_tag "landing/hero/dematerialiser.svg", class: "paperless-logo"
-        %h3 Un outil simple
+        .baseline.center
-        %p
+          %h3 Un outil simple
-          pour gérer les formulaires
+          %p
-          %br
+            pour gérer les formulaires
-          administratifs dématérialisés.
+            %br
+            administratifs dématérialisés.
+      - else
+        .text-right
+          = link_to "Fermer", users_no_procedure_url, class: "link close-procedure"
+        .procedure-logos
+          = image_tag @dossier.procedure.decorate.logo_img
+          - if @dossier.procedure.euro_flag
+            = image_tag "flag_of_europe.svg"
+
+        %h2.procedure-title
+          = @dossier.procedure.libelle
+        %p.procedure-description
+          = h @dossier.procedure.description.html_safe
+
     .login-form
       %h1.center Connectez-vous