feat(stellungnahme): Button subtiles Wiggle-Rotate statt bounce
Deploy / verify (push) Failing after 50s
Deploy / deploy (push) Has been skipped

This commit is contained in:
Peter Meier
2026-05-28 13:32:08 +02:00
parent 2bae9b3e5d
commit 4e46e82770
@@ -895,7 +895,7 @@ ${"=".repeat(64)}`;
<div class="mb-2 flex gap-3"> <div class="mb-2 flex gap-3">
<button class="rounded-lg border border-stein-300 px-4 py-2 text-sm text-stein-600 hover:bg-stein-50" onclick={() => goTo(3)}> Zurück</button> <button class="rounded-lg border border-stein-300 px-4 py-2 text-sm text-stein-600 hover:bg-stein-50" onclick={() => goTo(3)}> Zurück</button>
<button <button
class="btn-wiggle rounded-lg bg-wald-700 px-6 py-2.5 font-semibold text-white transition hover:bg-wald-800 disabled:opacity-40" class="btn-wiggle rounded-lg bg-wald-700 px-6 py-2.5 font-semibold text-white transition hover:bg-wald-800 disabled:opacity-40"
disabled={!absenderName.trim()} disabled={!absenderName.trim()}
onclick={generateOutput} onclick={generateOutput}
@@ -963,3 +963,19 @@ ${"=".repeat(64)}`;
{/if} {/if}
</div> </div>
{/if} {/if}
</section>
<style>
@keyframes wiggle {
0%, 100% { transform: rotate(0deg); }
20% { transform: rotate(-2deg); }
40% { transform: rotate(2deg); }
60% { transform: rotate(-1.5deg); }
80% { transform: rotate(1.5deg); }
}
.btn-wiggle {
animation: wiggle 2.4s ease-in-out infinite;
}
.btn-wiggle:hover {
animation: none;
}