From 267101a79211b221f4e095de742840a5609aca86 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Tue, 12 Apr 2022 16:32:20 +0000
Subject: [PATCH] Bug 28786: (follow-up) Improve style of 2FA code input

This patch cleans up login.css a little bit so that the same style rules
which apply to the login screen apply to the 2FA input form as well.

The patch also changes the "Log out" link on the 2FA form to a "Cancel"
link alongside the "Verify" button.

To test, apply the patch and start the process of logging in to the
staff client using an account with 2FA enabled.

On both the login form and 2FA code views, confirm that everything is
styled consistently.

Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
---
 koha-tmpl/intranet-tmpl/prog/css/login.css    | 39 ++++++++-----------
 .../intranet-tmpl/prog/en/modules/auth.tt     | 14 ++++---
 2 files changed, 25 insertions(+), 28 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/css/login.css b/koha-tmpl/intranet-tmpl/prog/css/login.css
index 722e9f420c..1a8c06a3a3 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/login.css
+++ b/koha-tmpl/intranet-tmpl/prog/css/login.css
@@ -92,14 +92,6 @@ label {
     overflow: hidden;
 }
 
-#login input {
-	padding: 3px;
-}
-
-#login select {
-    width: 98%;
-}
-
 #login ul {
 	list-style: none;
 	margin: 0;
@@ -112,15 +104,6 @@ label {
 	text-align: center;
 }
 
-#login #userid, #password {
-	font-size: 1.7em;
-	width: 97%;
-}
-
-#login #branch, #login #desk_id {
-	width : 99%;
-}
-
 #login #submit-button, #login .button {
 	font-size: 1.4em;
 	padding : .3em .6em;
@@ -173,10 +156,20 @@ label {
 }
 
 textarea, input, select {
-	background: #f4f4f4;
-	border: 1px solid #b2b2b2;
-	color: #000;
-	font:  13px Verdana, Arial, Helvetica, sans-serif;
-	margin: 1px;
-	padding: 3px;
+    background: #f4f4f4;
+    border: 1px solid #b2b2b2;
+    color: #000;
+    font:  13px Verdana, Arial, Helvetica, sans-serif;
+    margin: 1px;
+    padding: 3px;
+}
+
+select {
+    width: 97%;
+}
+
+input[type='text'],
+input[type='password'] {
+    font-size: 1.7em;
+    width: 97%;
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/auth.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/auth.tt
index 944942498b..310e2b568e 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/auth.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/auth.tt
@@ -143,13 +143,17 @@
             <input type="hidden" name="[% INPUT.name | html %]" value="[% INPUT.value | html %]" />
         [% END %]
         [% IF invalid_otp_token %]
-            <div class="dialog error">Invalid two-factor code</div>
+            <div id="login_error">Invalid two-factor code</div>
         [% END %]
 
-        <p><label for="otp_token">Two-factor authentication code:</label>
-        <input type="text" name="otp_token" id="otp_token" class="input focus" value="" size="20" tabindex="1" />
-        <p class="submit"><input id="submit-button" type="submit" value="Verify code" /></p>
-        <a class="logout" id="logout" href="/cgi-bin/koha/mainpage.pl?logout.x=1">Log out</a>
+        <p>
+            <label for="otp_token">Two-factor authentication code:</label>
+            <input type="text" name="otp_token" id="otp_token" class="input focus" value="" size="20" tabindex="1" />
+        </p>
+        <p>
+            <input id="submit-button" type="submit" value="Verify code" />
+            <a class="cancel" id="logout" href="/cgi-bin/koha/mainpage.pl?logout.x=1">Cancel</a>
+        </p>
 
     </form>
 [% END %]
-- 
2.39.5