Fix: Spinner und Text im Login-Button immer nebeneinander

Livewire setzt beim Einblenden display:inline statt inline-flex.
Innerer Wrapper erzwingt inline-flex damit SVG und Text nie stacken.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
main
boban 2026-04-24 14:14:16 +02:00
parent a30c21a1a9
commit 4f3066e225
1 changed files with 7 additions and 5 deletions

View File

@ -94,12 +94,14 @@
class="mbx-btn-primary" class="mbx-btn-primary"
style="width:100%;justify-content:center;font-size:13px;padding:9px 16px"> style="width:100%;justify-content:center;font-size:13px;padding:9px 16px">
<span wire:loading.remove wire:target="login">Anmelden</span> <span wire:loading.remove wire:target="login">Anmelden</span>
<span wire:loading wire:target="login" style="display:none;align-items:center;gap:6px"> <span wire:loading wire:target="login" style="display:none">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" style="animation:spin .7s linear infinite"> <span style="display:inline-flex;align-items:center;gap:6px">
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" style="animation:spin .7s linear infinite;flex-shrink:0">
<path d="M10 6A4 4 0 1 1 6 2" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/> <path d="M10 6A4 4 0 1 1 6 2" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/>
</svg> </svg>
wird geprüft… wird geprüft…
</span> </span>
</span>
</button> </button>
</form> </form>
</div> </div>