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 0dcb9145e..12e1b6cda 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 2fc7bad98..3e76cf2e8 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 28eb6389c..2e843e0d7 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 12e1b6cda..44b3564cc 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 3e76cf2e8..af667756a 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 2e843e0d7..a06cdb3f6 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;">