Новый правки компоентов

This commit is contained in:
Web-serfer 2026-05-05 20:42:34 +05:00
parent abcb294a7c
commit ae08bcdcb7
2 changed files with 51 additions and 11 deletions

View file

@ -70,7 +70,7 @@ import { SITE_URL } from '@constants';
if (!email) return;
submitBtn.disabled = true;
submitBtn.textContent = 'Отправка...';
submitBtn.classList.add('loading');
try {
const response = await fetch('/api/auth/request-password-reset', {
@ -87,15 +87,18 @@ import { SITE_URL } from '@constants';
} else {
const errorEl = document.getElementById('email-error');
if (errorEl) errorEl.textContent = data.error || 'Ошибка';
submitBtn.disabled = false;
submitBtn.classList.remove('loading');
}
} catch (err) {
if (formError) {
formError.textContent = 'Ошибка соединения';
formError.classList.remove('hidden');
}
submitBtn.disabled = false;
submitBtn.classList.remove('loading');
} finally {
submitBtn.disabled = false;
submitBtn.textContent = 'Отправить ссылку';
}
});
</script>
@ -197,6 +200,31 @@ import { SITE_URL } from '@constants';
cursor: not-allowed;
}
.btn-submit.loading {
position: relative;
color: transparent !important;
pointer-events: none;
}
.btn-submit.loading::after {
content: '';
position: absolute;
width: 20px;
height: 20px;
top: 50%;
left: 50%;
margin-left: -10px;
margin-top: -10px;
border: 2px solid #ffffff;
border-radius: 50%;
border-top-color: transparent;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
.auth-messages {
margin-top: 1.5rem;
text-align: center;

View file

@ -57,6 +57,7 @@ const error = Astro.url.searchParams.get('error');
<div class="form-group">
<label for="confirmPassword">Подтвердите пароль</label>
<div class="password-wrapper">
<input
type="password"
id="confirmPassword"
@ -66,6 +67,17 @@ const error = Astro.url.searchParams.get('error');
minlength="8"
maxlength="12"
/>
<button type="button" class="toggle-password" data-target="confirmPassword">
<svg class="eye-open" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
<circle cx="12" cy="12" r="3"></circle>
</svg>
<svg class="eye-closed" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path>
<line x1="1" y1="1" x2="23" y2="23"></line>
</svg>
</button>
</div>
<span class="error-message" id="confirm-error"></span>
</div>