PWA-Login: Passwort-Sichtbar-Toggle (Auge-Icon)
All checks were successful
Deploy baustelle-pwa / deploy (push) Successful in 13s

Auge-Button im Passwort-Feld schaltet zwischen Klartext und Punkten um.
Hilft Tippfehler zu vermeiden (z.B. bei EN-Tastaturlayout via Remote-Desktop).

[deploy]
This commit is contained in:
Eddy 2026-07-06 16:16:10 +02:00
parent 17575f38e4
commit b8ed5f2276

14
app.js
View file

@ -345,10 +345,22 @@ router.on('/login', async () => {
<form class="login-form" id="login-form">
<h2>🔧 Baustelle</h2>
<input type="text" name="login" placeholder="Benutzername" autocomplete="username" required>
<input type="password" name="password" placeholder="Passwort" autocomplete="current-password" required>
<div style="position:relative;">
<input type="password" id="bl-pass" name="password" placeholder="Passwort" autocomplete="current-password" required style="padding-right:46px;">
<button type="button" id="bl-pass-toggle" tabindex="-1" aria-label="Passwort anzeigen" style="position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:0;color:#f0f0f0;opacity:0.5;cursor:pointer;padding:6px;line-height:0;">
<svg viewBox="0 0 24 24" width="22" height="22" fill="currentColor"><path d="M12 5c-5 0-9.3 3.1-11 7 1.7 3.9 6 7 11 7s9.3-3.1 11-7c-1.7-3.9-6-7-11-7zm0 12a5 5 0 110-10 5 5 0 010 10zm0-8a3 3 0 100 6 3 3 0 000-6z"/></svg>
</button>
</div>
<button type="submit" class="btn btn-large">Anmelden</button>
</form>
`;
const _blPass = document.getElementById('bl-pass');
const _blToggle = document.getElementById('bl-pass-toggle');
if (_blToggle && _blPass) _blToggle.addEventListener('click', () => {
const show = _blPass.type === 'password';
_blPass.type = show ? 'text' : 'password';
_blToggle.style.opacity = show ? '1' : '0.5';
});
document.getElementById('login-form').addEventListener('submit', async (e) => {
e.preventDefault();
const fd = new FormData(e.target);