add loading overlay to button when sending signup
All checks were successful
deploy / build-and-deploy (push) Successful in 37s

This commit is contained in:
2025-12-08 20:07:53 +01:00
parent d0051a0bff
commit c408d5b787
2 changed files with 40 additions and 3 deletions

View File

@@ -124,7 +124,7 @@ const { signupDisabled, signupHash } = Astro.props;
</span>
</Checkbox>
</div>
<button class="btn btn-neutral">Anmeldung absenden</button>
<button id="send-btn" class="btn btn-neutral">Anmeldung absenden</button>
</form>
</div>
</div>
@@ -181,6 +181,7 @@ const { signupDisabled, signupHash } = Astro.props;
function setupForm() {
const form = document.getElementById('signup')! as HTMLFormElement;
const sendBtn = document.getElementById('send-btn')! as HTMLButtonElement;
// reset form on site (re-)load
form.reset();
@@ -229,9 +230,11 @@ const { signupDisabled, signupHash } = Astro.props;
});
};
form.addEventListener('submit', (e) => {
form.addEventListener('submit', async (e) => {
e.preventDefault();
sendSignup();
sendBtn.classList.add('loading-overlay');
await sendSignup();
sendBtn.classList.remove('loading-overlay');
});
}