From d3f276293890bf9c990b18fe7d96d95598ccb25f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fr=C3=A9d=C3=A9ric=20P=C3=A9ters?= <fpeters@entrouvert.com>
Date: Wed, 20 Jul 2022 20:53:11 +0200
Subject: [PATCH] grandlyon-glc: use <button> in authorization page (#67567)

---
 static/grandlyon-glc/_custom.scss             | 26 ++++++++++++-------
 .../authentic2_idp_oidc/authorization.html    |  4 +--
 2 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/static/grandlyon-glc/_custom.scss b/static/grandlyon-glc/_custom.scss
index 0050c832..1135a399 100644
--- a/static/grandlyon-glc/_custom.scss
+++ b/static/grandlyon-glc/_custom.scss
@@ -196,9 +196,11 @@ div#main-content {
 		}
 	}
 
-	div.a2-authorization-form input[type=submit] {
-		width: 11em;
-		margin: 5px 0.8em;
+	div.a2-authorization-form button {
+		@media screen and ($min-desktop-viewport) {
+			margin: 5px 0.8em;
+			width: 11em;
+		}
 	}
 
 	/* display title list in one line */
@@ -219,7 +221,7 @@ div#main-content {
 		padding: 0.7em 1em;
 		margin: 1ex 0 0.5ex 0;
 	}
-	input[type=submit], button {
+	button {
 		margin-top: 1ex;
 		width: 100%;
 		text-transform: uppercase;
@@ -433,12 +435,18 @@ div.a2-authorization {
 		font-size: 90%;
 	}
 	div.a2-authorization-form {
-		input[type=submit] {
+		button {
 			&.lock {
-				background-image: url(images/lock.png);
-				background-repeat: no-repeat;
-				background-position: 10%;
-				background-size: 15px;
+				&::before {
+					content: "";
+					display: inline-block;
+					width: 25px;
+					height: 15px;
+					background-image: url(images/lock.png);
+					background-repeat: no-repeat;
+					background-position: center left;
+					background-size: 15px;
+				}
 			}
 			&.refuse {
 				background-color: #ffffff;
diff --git a/templates/variants/grandlyon-glc/authentic2_idp_oidc/authorization.html b/templates/variants/grandlyon-glc/authentic2_idp_oidc/authorization.html
index 8cf09507..a37d0645 100644
--- a/templates/variants/grandlyon-glc/authentic2_idp_oidc/authorization.html
+++ b/templates/variants/grandlyon-glc/authentic2_idp_oidc/authorization.html
@@ -64,8 +64,8 @@
       {% endif %}
       {% csrf_token %}
     <p>
-      <input type="submit" name="accept" value="Partager" class="lock">
-      <input type="submit" name="refuse" value="Abandonner" class="refuse">
+      <button name="accept" class="lock">Partager</button>
+      <button name="refuse" class="refuse">Abandonner</button>
     </p>
   </form>
   </div>