From 42536f1badac4a3ccdd6e1165b7a07e42c656ae5 Mon Sep 17 00:00:00 2001 From: thek4n Date: Sun, 7 Jun 2026 15:06:17 +0300 Subject: [PATCH] feat(frontend): add show password button --- assets/setup.html | 60 +++++++++++++++++++++++++++++++++++------------ 1 file changed, 45 insertions(+), 15 deletions(-) diff --git a/assets/setup.html b/assets/setup.html index 59d4348..13404d8 100644 --- a/assets/setup.html +++ b/assets/setup.html @@ -171,22 +171,20 @@ opacity: 1; } - .hint { - font-size: 0.7rem; - color: #6f8aae; - margin-top: 24px; - border-top: 1px solid rgba(72, 92, 118, 0.4); - padding-top: 20px; - display: flex; - justify-content: center; - gap: 16px; - } - @media (max-width: 500px) { .card { padding: 24px 20px 32px; } h1 { font-size: 1.5rem; } .save-btn { font-size: 1.2rem; } } + + footer { + text-align: center; + font-size: 0.7rem; + margin-top: 22px; + color: #6f8aae; + opacity: 0.7; + font-weight: 500; + } @@ -222,7 +220,15 @@ Пароль - +
+ + +
-
- ⚡IoT контроллер давления | © Vladislav Kan <thek4n@yandex.ru> -
+
✓ Wi-Fi settings sent
@@ -248,6 +252,32 @@ let saveTimeout = null; + // Toggle password visibility + const togglePasswordBtn = document.getElementById('togglePassword'); + const passwordField = document.getElementById('passwordInput'); + + if (togglePasswordBtn && passwordField) { + togglePasswordBtn.addEventListener('click', function() { + const type = passwordField.getAttribute('type') === 'password' ? 'text' : 'password'; + passwordField.setAttribute('type', type); + + // Change eye icon + const svg = this.querySelector('svg'); + if (type === 'text') { + svg.innerHTML = ''; + } else { + svg.innerHTML = ''; + } + }); + + togglePasswordBtn.addEventListener('mouseenter', () => { + togglePasswordBtn.style.opacity = '1'; + }); + togglePasswordBtn.addEventListener('mouseleave', () => { + togglePasswordBtn.style.opacity = '0.7'; + }); + } + function showToast(message, isError = false) { toast.innerText = message; if (isError) {