feat: add loading indicator when button pressed
This commit is contained in:
parent
3097169143
commit
f149f21f61
|
|
@ -78,3 +78,7 @@ body {
|
|||
.input:focus {
|
||||
border-color: var(--af-cyan);
|
||||
}
|
||||
|
||||
.loading-button {
|
||||
filter: brightness(0.7);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,17 @@
|
|||
</html>
|
||||
|
||||
<script>
|
||||
document.body.addEventListener('htmx:beforeRequest', function(event) {
|
||||
const closeButton = event.target.querySelector('.button');
|
||||
closeButton.classList.add('loading-button');
|
||||
closeButton.disabled = true;
|
||||
});
|
||||
|
||||
document.body.addEventListener("htmx:afterRequest", function (evt) {
|
||||
const closeButton = event.target.querySelector('.button');
|
||||
closeButton.classList.remove('loading-button');
|
||||
closeButton.disabled = false;
|
||||
|
||||
const detail = evt.detail;
|
||||
if (detail.failed) {
|
||||
const xhr = detail.xhr;
|
||||
|
|
|
|||
Loading…
Reference in New Issue