feat: amélioration bouton pro_connect (#847)

## Description 🎸 ajout d'un texte explicatif au dessus du bouton pro connect ## Type de changement 🎨 changement d'UI ### Captures d'écran (optionnel) ![image](https://github.com/user-attachments/assets/82d0cd02-455c-4362-a036-460c762aa1ec)
gip-inclusion · Dec 4, 2024 · 09397af · 09397af
1 parent fb50472
commit 09397af
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/lacommunaute/templates/registration/login_with_magic_link.html b/lacommunaute/templates/registration/login_with_magic_link.html
@@ -22,6 +22,9 @@ <h1 class="s-title-01__title h1">{% trans "Login | Sign in" %}</h1>
                 <div class="s-section__col col-12 col-lg-7">
                     <div class="c-form">
                         <div class="text-center">
+                            <p>
+                                ProConnect vous permet d'accéder à de nombreux services en ligne en utilisant l'un de vos comptes professionnels existants.
+                            </p>
                             <a href="{% url 'openid_connect:authorize' %}?next={{ next }}" rel="nofollow" class="proconnect-button"></a>
                             <p>
                                 <a href="https://proconnect.gouv.fr/" target="_blank" rel="noopener noreferrer" title="Qu’est-ce que AgentConnect ? - nouvelle fenêtre">

diff --git a/lacommunaute/users/tests/__snapshots__/tests_views.ambr b/lacommunaute/users/tests/__snapshots__/tests_views.ambr
@@ -227,6 +227,9 @@
                   <div class="s-section__col col-12 col-lg-7">
                       <div class="c-form">
                           <div class="text-center">
+                              <p>
+                                  ProConnect vous permet d'accéder à de nombreux services en ligne en utilisant l'un de vos comptes professionnels existants.
+                              </p>
                               <a class="proconnect-button" href="/pro_connect/authorize?next=" rel="nofollow"></a>
                               <p>
                                   <a href="https://proconnect.gouv.fr/" rel="noopener noreferrer" target="_blank" title="Qu’est-ce que AgentConnect ? - nouvelle fenêtre">
@@ -301,6 +304,9 @@
                   <div class="s-section__col col-12 col-lg-7">
                       <div class="c-form">
                           <div class="text-center">
+                              <p>
+                                  ProConnect vous permet d'accéder à de nombreux services en ligne en utilisant l'un de vos comptes professionnels existants.
+                              </p>
                               <a class="proconnect-button" href="/pro_connect/authorize?next=" rel="nofollow"></a>
                               <p>
                                   <a href="https://proconnect.gouv.fr/" rel="noopener noreferrer" target="_blank" title="Qu’est-ce que AgentConnect ? - nouvelle fenêtre">
@@ -375,6 +381,9 @@
                   <div class="s-section__col col-12 col-lg-7">
                       <div class="c-form">
                           <div class="text-center">
+                              <p>
+                                  ProConnect vous permet d'accéder à de nombreux services en ligne en utilisant l'un de vos comptes professionnels existants.
+                              </p>
                               <a class="proconnect-button" href="/pro_connect/authorize?next=" rel="nofollow"></a>
                               <p>
                                   <a href="https://proconnect.gouv.fr/" rel="noopener noreferrer" target="_blank" title="Qu’est-ce que AgentConnect ? - nouvelle fenêtre">