From bd5c18b145707b1488411f2dafea8e0603e62047 Mon Sep 17 00:00:00 2001
From: Paul Seebach <admin@ezxd.cloud>
Date: Sat, 21 Mar 2026 15:54:34 +0100
Subject: [PATCH 1/2] [Web] Add show/hide password toggle on login pages

Adds an eye icon button to the password field on the user, admin, and
domain admin login pages. Clicking it toggles between hidden and visible
password text, using Bootstrap Icons (bi-eye / bi-eye-slash).

Closes #6893
---
 data/web/templates/admin_index.twig       | 1 +
 data/web/templates/domainadmin_index.twig | 1 +
 data/web/templates/user_index.twig        | 1 +
 3 files changed, 3 insertions(+)

diff --git a/data/web/templates/admin_index.twig b/data/web/templates/admin_index.twig
index 0dcb9145..12e1b6cd 100644
--- a/data/web/templates/admin_index.twig
+++ b/data/web/templates/admin_index.twig
@@ -49,6 +49,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
+              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="d-flex justify-content-between mt-4" style="position: relative">
diff --git a/data/web/templates/domainadmin_index.twig b/data/web/templates/domainadmin_index.twig
index 2fc7bad9..3e76cf2e 100644
--- a/data/web/templates/domainadmin_index.twig
+++ b/data/web/templates/domainadmin_index.twig
@@ -49,6 +49,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
+              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="d-flex justify-content-between mt-4" style="position: relative">
diff --git a/data/web/templates/user_index.twig b/data/web/templates/user_index.twig
index 28eb6389..2e843e0d 100644
--- a/data/web/templates/user_index.twig
+++ b/data/web/templates/user_index.twig
@@ -56,6 +56,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
+              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="mt-2 text-muted" style="font-size: 0.9rem;">

From 5408bc809d4304806fb1a54baf099e0bc9dd9e56 Mon Sep 17 00:00:00 2001
From: Paul Seebach <admin@ezxd.cloud>
Date: Sat, 21 Mar 2026 15:59:29 +0100
Subject: [PATCH 2/2] [Web] Use input-group-text for password toggle button

Replaces btn-outline-secondary with input-group-text so the toggle
button border matches the surrounding input group consistently.
---
 data/web/templates/admin_index.twig       | 2 +-
 data/web/templates/domainadmin_index.twig | 2 +-
 data/web/templates/user_index.twig        | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/data/web/templates/admin_index.twig b/data/web/templates/admin_index.twig
index 12e1b6cd..44b3564c 100644
--- a/data/web/templates/admin_index.twig
+++ b/data/web/templates/admin_index.twig
@@ -49,7 +49,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
-              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
+              <button type="button" class="input-group-text" style="cursor:pointer;" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="d-flex justify-content-between mt-4" style="position: relative">
diff --git a/data/web/templates/domainadmin_index.twig b/data/web/templates/domainadmin_index.twig
index 3e76cf2e..af667756 100644
--- a/data/web/templates/domainadmin_index.twig
+++ b/data/web/templates/domainadmin_index.twig
@@ -49,7 +49,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
-              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
+              <button type="button" class="input-group-text" style="cursor:pointer;" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="d-flex justify-content-between mt-4" style="position: relative">
diff --git a/data/web/templates/user_index.twig b/data/web/templates/user_index.twig
index 2e843e0d..a06cdb3f 100644
--- a/data/web/templates/user_index.twig
+++ b/data/web/templates/user_index.twig
@@ -56,7 +56,7 @@
             <div class="input-group">
               <div class="input-group-text"><i class="bi bi-lock-fill"></i></div>
               <input name="pass_user" type="password" id="pass_user" class="form-control" placeholder="{{ lang.login.password }}" required="" autocomplete="current-password">
-              <button type="button" class="btn btn-outline-secondary" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
+              <button type="button" class="input-group-text" style="cursor:pointer;" onclick="var i=document.getElementById('pass_user'),ic=this.querySelector('i');if(i.type==='password'){i.type='text';ic.className='bi bi-eye-slash';}else{i.type='password';ic.className='bi bi-eye';}" tabindex="-1" aria-label="Toggle password visibility"><i class="bi bi-eye"></i></button>
             </div>
           </div>
           <div class="mt-2 text-muted" style="font-size: 0.9rem;">