[REMANIEMENT] Factorise style boutons

Co-authored-by: Fabien Lamarque <[email protected]>
numerique-gouv · Jun 11, 2024 · a74f4cc · a74f4cc
1 parent 9362b26
commit a74f4cc
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 18 deletions.
diff --git a/public/assets/styles/pageAccueil.css b/public/assets/styles/pageAccueil.css
@@ -1,26 +1,25 @@
-.bouton-franceconnect {
-    display: block;
-    cursor: pointer;
+.bouton {
+  display: block;
+  cursor: pointer;
 
-    width: 256px;
-    height: 60px;
-    margin-bottom: 12px;
-    background-image: url(/statique/assets/images/bouton_france_connect_plus.svg);
+  width: 256px;
+  height: 60px;
+  background-repeat: no-repeat;
+  background-size: contain;
 }
 
-.bouton-franceconnect:hover {
-    background-image: url(/statique/assets/images/bouton_survol_france_connect_plus.svg);
+.bouton.franceconnect {
+  margin-bottom: 12px;
+  background-image: url(/statique/assets/images/bouton_france_connect_plus.svg);
 }
 
-.bouton-eidas {
-  display: block;
-  cursor: pointer;
+.bouton.franceconnect:hover {
+  background-image: url(/statique/assets/images/bouton_survol_france_connect_plus.svg);
+}
 
-  width: 256px;
-  height: 60px;
+.bouton.eidas {
   margin-top: 12px;
-  background: url(/statique/assets/images/bouton_eidas.png) no-repeat;
-  background-size: contain;
+  background-image: url(/statique/assets/images/bouton_eidas.png);
 }
 
 .nouvel-onglet::after{

diff --git a/src/vues/pageAccueil.mustache b/src/vues/pageAccueil.mustache
@@ -13,10 +13,10 @@
       <p>
       FranceConnect+ est la solution proposée par l'État pour renforcer la sécurité de vos services en ligne les plus sensibles.
       </p>
-      <a class="bouton-franceconnect" href="/auth/fcplus/creationSession"></a>
+      <a class="bouton franceconnect" href="/auth/fcplus/creationSession"></a>
       <a href="https://franceconnect.gouv.fr/france-connect-plus" class="nouvel-onglet" target="_blank">Qu'est-ce que FranceConnect+ ?</a>
       {{#avecConnexionEIDAS}}
-        <a class="bouton-eidas" href="/auth/fcplus/creationSession?eidas"></a>
+        <a class="bouton eidas" href="/auth/fcplus/creationSession?eidas"></a>
       {{/avecConnexionEIDAS}}
     </div>
   {{/infosUtilisateur}}