fix loader

This commit is contained in:
Constantin Simonis 2025-01-31 09:10:35 +01:00
parent 024e9fe186
commit 05249215bd
Signed by: csimonis
GPG Key ID: 758DD9C506603183
2 changed files with 6 additions and 4 deletions

View File

@ -62,7 +62,8 @@ export default class extends Controller {
} }
this.submitTarget.querySelector("span").classList.add("hidden"); this.submitTarget.querySelector("span").classList.add("hidden");
this.submitTarget.querySelector("svg").classList.remove("hidden"); this.submitTarget.querySelector("svg.arrow").classList.add("hidden");
this.submitTarget.querySelector("svg.loader").classList.remove("hidden");
const tickets = this.element.querySelectorAll(".forms > div"); const tickets = this.element.querySelectorAll(".forms > div");
const personalData = this.getPersonalData(); const personalData = this.getPersonalData();
@ -81,7 +82,8 @@ export default class extends Controller {
}, },
}).then((response) => { }).then((response) => {
if (!response.ok) { if (!response.ok) {
this.submitTarget.querySelector("svg").classList.add("hidden"); this.submitTarget.querySelector("svg.error").classList.add("hidden");
this.submitTarget.querySelector("svg.loader").classList.remove("hidden");
this.submitTarget.querySelector("span").classList.remove("hidden"); this.submitTarget.querySelector("span").classList.remove("hidden");
this.showError("Ein Fehler ist aufgetreten. Bitte versuchen Sie es erneut."); this.showError("Ein Fehler ist aufgetreten. Bitte versuchen Sie es erneut.");
} else { } else {

View File

@ -79,8 +79,8 @@
<button type="submit" data-action="form#submit" data-form-target="submit" class="bg-gradient-to-r from-red-500 to-orange-500 hover:from-red-600 hover:to-orange-600 text-white px-8 py-3 rounded-xl text-sm font-medium shadow-md hover:shadow-lg transition-all duration-300 flex items-center space-x-2"> <button type="submit" data-action="form#submit" data-form-target="submit" class="bg-gradient-to-r from-red-500 to-orange-500 hover:from-red-600 hover:to-orange-600 text-white px-8 py-3 rounded-xl text-sm font-medium shadow-md hover:shadow-lg transition-all duration-300 flex items-center space-x-2">
<span>Jetzt bestellen</span> <span>Jetzt bestellen</span>
<twig:ux:icon name="line-md:arrow-right-circle" class="w-4 h-4" /> <twig:ux:icon name="line-md:arrow-right-circle" class="arrow w-4 h-4" />
<twig:ux:icon name="loader" class="hidden w-4 h-4 animate-spin" /> <twig:ux:icon name="loader" class="loader hidden w-4 h-4 animate-spin" />
</button> </button>
</div> </div>
</section> </section>