move to embedded css, update hx state for spinner bug

This commit is contained in:
2025-08-17 14:32:33 +00:00
parent 749d68cdeb
commit 18d151e0cf
3 changed files with 22 additions and 10 deletions

View File

@@ -13,13 +13,21 @@ templ Layout(title string) {
<body>
{ children... }
<script>
document.body.addEventListener('htmx:beforeRequest', function(e) {
e.detail.elt.classList.add('loading');
});
document.body.addEventListener('htmx:afterRequest', function(e) {
e.detail.elt.classList.remove('loading');
});
document.body.addEventListener('htmx:beforeRequest', function(evt) {
evt.detail.elt.classList.add('loading');
});
document.body.addEventListener('htmx:afterRequest', function(evt) {
document.querySelectorAll('.loading').forEach(el => {
el.classList.remove('loading');
});
});
document.body.addEventListener('htmx:beforeSwap', function(evt) {
document.querySelectorAll('.loading').forEach(el => {
el.classList.remove('loading');
});
});
</script>
</body>
</html>

View File

@@ -50,7 +50,7 @@ func Layout(title string) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "<script>\n document.body.addEventListener('htmx:beforeRequest', function(e) {\n e.detail.elt.classList.add('loading');\n });\n\n document.body.addEventListener('htmx:afterRequest', function(e) {\n e.detail.elt.classList.remove('loading');\n });\n </script></body></html>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "<script>\n\t\t document.body.addEventListener('htmx:beforeRequest', function(evt) {\n\t evt.detail.elt.classList.add('loading');\n\t\t });\n \n\t\t document.body.addEventListener('htmx:afterRequest', function(evt) {\n\t\t document.querySelectorAll('.loading').forEach(el => {\n\t\t el.classList.remove('loading');\n\t\t });\n\t\t });\n \n\t\t document.body.addEventListener('htmx:beforeSwap', function(evt) {\n\t\t document.querySelectorAll('.loading').forEach(el => {\n\t\t el.classList.remove('loading');\n\t\t });\n\t\t });\n </script></body></html>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}