Fix registration button: enable when email+8+ chars; show hint

This commit is contained in:
root 2026-08-20 18:00:50 +00:00
parent be8d196734
commit 41019d476d

View File

@ -164,11 +164,12 @@ const App = {
Здесь можно зайти по email для тестирования. Здесь можно зайти по email для тестирования.
</div> </div>
<label>Email</label> <label>Email</label>
<input class="input" id="el-email" type="email" placeholder="you@example.com"> <input class="input" id="el-email" type="email" placeholder="you@example.com" autocomplete="email">
<label>Пароль</label> <label>Пароль (8 символов)</label>
<input class="input" id="el-pass" type="password" placeholder="минимум 8 символов"> <input class="input" id="el-pass" type="password" placeholder="минимум 8 символов" autocomplete="current-password">
<button class="btn" id="el-login">Войти</button> <button class="btn" id="el-login" disabled>Войти</button>
<button class="btn ghost" id="el-register">Регистрация</button> <button class="btn ghost" id="el-register" disabled>Регистрация</button>
<div class="sub" id="el-hint" style="margin-top:8px;text-align:center;">Введите email и пароль</div>
</div> </div>
<div class="card" style="font-size:12px;color:var(--text-dim);"> <div class="card" style="font-size:12px;color:var(--text-dim);">
🍻 BuhApp приложение для лиц 18+. Встречи и употребление алкоголя на свой риск. 🍻 BuhApp приложение для лиц 18+. Встречи и употребление алкоголя на свой риск.
@ -178,6 +179,28 @@ const App = {
`; `;
document.getElementById('el-login').onclick = () => this.emailLogin(); document.getElementById('el-login').onclick = () => this.emailLogin();
document.getElementById('el-register').onclick = () => this.emailRegister(); document.getElementById('el-register').onclick = () => this.emailRegister();
// live-валидация
const update = () => {
const email = document.getElementById('el-email').value.trim();
const pass = document.getElementById('el-pass').value;
const ok = email.length > 0 && pass.length >= 8;
document.getElementById('el-login').disabled = !ok;
document.getElementById('el-register').disabled = !ok;
const hint = document.getElementById('el-hint');
if (pass.length > 0 && pass.length < 8) {
hint.textContent = 'Пароль слишком короткий (' + pass.length + '/8)';
hint.style.color = 'var(--danger)';
} else if (ok) {
hint.textContent = '✓ Готово';
hint.style.color = 'var(--success)';
} else {
hint.textContent = 'Введите email и пароль';
hint.style.color = 'var(--text-dim)';
}
};
document.getElementById('el-email').addEventListener('input', update);
document.getElementById('el-pass').addEventListener('input', update);
}, },
async emailLogin() { async emailLogin() {