Merge pull request #6816 from kreushed/france-connect-update

Intégration des maquettes AgentConnect

app/assets/stylesheets/auth.scss

@@ -61,3 +61,10 @@
     margin-bottom: 0;
   }
 }
+
+#session-new {
+  .important-header {
+    font-weight: bold;
+    font-size: 18px;
+  }
+}

app/assets/stylesheets/france-connect-login.scss

@@ -15,8 +15,8 @@
 
 .france-connect-login-button {
   display: inline-block;
-  height: 52px;
+  height: 60px;
-  width: 186px;
+  width: 230px;
   margin: auto;
   margin-bottom: 8px;
   background-image: image-url("login-with-fc.svg"), image-url("login-with-fc-hover.svg");

app/assets/stylesheets/procedure_context.scss

@@ -22,6 +22,12 @@ $procedure-description-line-height: 22px;
     font-weight: bold;
   }
 
+  .small-simple {
+    font-size: 16px;
+    color: $blue-france-500;
+    font-weight: bold;
+  }
+
   .close-procedure {
     font-size: 12px;
   }

app/views/layouts/commencer/_no_procedure.html.haml

@@ -7,3 +7,8 @@
       = t('.line2')
       %br
       = t('.line3')
+      %hr
+      %span.small-simple= t('.are_you_new', app_name: APPLICATION_NAME.gsub("-","‑")).html_safe
+      %br
+      %br
+      = link_to t('views.users.sessions.new.find_procedure'), COMMENT_TROUVER_MA_DEMARCHE_URL, target: "_blank", class: "button expend secondary"

app/views/shared/_france_connect_login.html.haml

@@ -1,6 +1,6 @@
 - if FranceConnectService.enabled?
   .france-connect-login
-    %h2
+    %h2.important-header
       = t('views.shared.france_connect_login.title')
     %p
       = t('views.shared.france_connect_login.description')

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

@@ -1,6 +1,6 @@
 = content_for(:page_id, 'auth')
 
-.auth-form.sign-in-form
+#session-new.auth-form.sign-in-form
 
   = form_for resource, url: user_session_path, html: { class: "form" } do |f|
     %h1.huge-title= t('views.users.sessions.new.sign_in')
@@ -27,11 +27,7 @@
     = t('views.shared.france_connect_login.separator')
   - if AgentConnectService.enabled?
     .center
-      %p.mb-2= t('views.users.sessions.new.instructor_or_admin')
+      %h2.important-header= t('views.users.sessions.new.state_civil_servant')
-      = link_to t('views.users.sessions.new.connect_with_agent_connect'), agent_connect_path
+      %br
-    %hr
+      %br
-  %p.center
+      = link_to t('views.users.sessions.new.connect_with_agent_connect'), agent_connect_path, class: "button expend secondary"
-    %span= t('views.users.sessions.new.are_you_new', app_name: APPLICATION_NAME.gsub("-","‑")).html_safe
-    %br
-    %br
-    = link_to t('views.users.sessions.new.find_procedure'), COMMENT_TROUVER_MA_DEMARCHE_URL, target: "_blank", class: "button expend secondary"

config/locales/en.yml

@@ -56,6 +56,7 @@ en:
         line1: A simple tool
         line2: to manage dematerialized
         line3: administrative forms.
+        are_you_new: First time on %{app_name}?
     locale_dropdown:
       languages: "Languages"
     notifications:
@@ -215,10 +216,9 @@ en:
           remember_me: Remember me
           reset_password: Forgot password?
           connection: Sign in
-          are_you_new: First time on %{app_name}?
           find_procedure: Find your procedure
-          instructor_or_admin: Instructor or Administrator ?
+          state_civil_servant: Are you a state civil servant?
-          connect_with_agent_connect: Connect with AgentConnect
+          connect_with_agent_connect: Visit our dedicated page
       passwords:
         reset_link_sent:
           got_it: Got it!

config/locales/fr.yml

@@ -47,6 +47,7 @@ fr:
         line1: Un outil simple
         line2: pour gérer les formulaires
         line3: administratifs dématérialisés.
+        are_you_new: Vous êtes nouveau sur %{app_name} ?
     locale_dropdown:
       languages: "Langues"
     notifications:
@@ -212,10 +213,9 @@ fr:
           remember_me: Se souvenir de moi
           reset_password: Mot de passe oublié ?
           connection: Se connecter
-          are_you_new: Vous êtes nouveau sur %{app_name} ?
           find_procedure: Trouvez votre démarche
-          instructor_or_admin: Vous êtes instructeur ou administrateur ?
+          state_civil_servant: Vous êtes agent de la fonction publique d’État ?
-          connect_with_agent_connect: Se connecter avec AgentConnect
+          connect_with_agent_connect: Accédez à notre page dédiée
       passwords:
         reset_link_sent:
           email_sent_html: "Nous vous avons envoyé un email à l’adresse <strong>%{email}</strong>."