From 506ed7f43faa57a184d900ac515caba00a951e92 Mon Sep 17 00:00:00 2001
From: MrSmoer <mrsmoer@noreply.codeberg.org>
Date: Thu, 7 Nov 2024 01:08:40 +0100
Subject: [PATCH 1/2] fix: Move "forgot_password"-link to fix login tab order

Previously hitting tab in the username field set the focus to the "forgot password" link. Only on the next hit the password field was selected.
This is an issue for some password managers (keepassdx android keyboard) and not as nice for accessibility.
Now the forgot link is below the sign up link at the bottom of the page.
Using "tabindex" didn't work properly with the templating engine because many elements get assigned a tabindex of "0" by default disrupting the tab selection sequence.
---
 templates/user/auth/signin_inner.tmpl | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/templates/user/auth/signin_inner.tmpl b/templates/user/auth/signin_inner.tmpl
index d4ba664e37..56532f4b98 100644
--- a/templates/user/auth/signin_inner.tmpl
+++ b/templates/user/auth/signin_inner.tmpl
@@ -17,9 +17,8 @@
 				<input id="user_name" type="text" name="user_name" value="{{.user_name}}" autofocus required>
 			</div>
 			{{if or (not .DisablePassword) .LinkAccountMode}}
-			<div class="required field {{if and (.Err_Password) (or (not .LinkAccountMode) (and .LinkAccountMode .LinkAccountModeSignIn))}}error{{end}} form-field-content-aside-label">
+			<div class="required field {{if and (.Err_Password) (or (not .LinkAccountMode) (and .LinkAccountMode .LinkAccountModeSignIn))}}error{{end}}">
 				<label for="password">{{ctx.Locale.Tr "password"}}</label>
-				<a href="{{AppSubUrl}}/user/forgot_password">{{ctx.Locale.Tr "auth.forgot_password"}}</a>
 				<input id="password" name="password" type="password" value="{{.password}}" autocomplete="current-password" required>
 			</div>
 			{{end}}
@@ -52,11 +51,15 @@
 <div class="ui container fluid">
 	{{template "user/auth/webauthn_error" .}}
 
-	{{if .ShowRegistrationButton}}
 		<div class="ui attached segment header top tw-max-w-2xl tw-m-auto tw-flex tw-flex-col tw-items-center">
+			{{if .ShowRegistrationButton}}
 			<div class="field">
 				{{ctx.Locale.Tr "auth.hint_register" (printf "%s/user/sign_up" AppSubUrl)}}
+				<br>
+			</div>
+			{{end}}
+			<div class="field">
+				<a href="{{AppSubUrl}}/user/forgot_password">{{ctx.Locale.Tr "auth.forgot_password"}}</a>
 			</div>
 		</div>
-	{{end}}
 </div>

From 8587d4997909a9a6ff52bf0f7fc9c6f945db5246 Mon Sep 17 00:00:00 2001
From: MrSmoer <mrsmoer@noreply.codeberg.org>
Date: Sat, 9 Nov 2024 23:23:59 +0100
Subject: [PATCH 2/2] Remove unused css class "form-field-content-aside-label"

This css class was used to display the "forgot password"-link right and above the password field.
cd75519a0b moves this link, so this class is now unused
---
 web_src/css/form.css | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/web_src/css/form.css b/web_src/css/form.css
index a8867009bc..fb9364db45 100644
--- a/web_src/css/form.css
+++ b/web_src/css/form.css
@@ -500,20 +500,6 @@ textarea:focus,
   }
 }
 
-/* form fields with additional content besides their label, used on login form
- * use like <div class="field"><label/><a/><input/></div> */
-.form-field-content-aside-label {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-}
-.form-field-content-aside-label > *:nth-child(2) {
-  text-align: right;
-  margin-bottom: 4px;
-}
-.form-field-content-aside-label input {
-  grid-column: span 2;
-}
-
 .ui.form .field > .selection.dropdown {
   min-width: 14em; /* matches the default min width */
 }