Auriculares Brisa
49,90 €
- Tarjeta
- Débito •••• 4242
- Envío
- Calle Mayor 12, Madrid
- Total
- 49,90 €
Pulsa dos veces para pagarPulsa otra vezComprobando…Hecho
Pedido confirmado
Bezahl-Sheet mit Doppeldruck
Ein Bezahl-Sheet, das einen doppelten Druck auf die Seitentaste verlangt, das Gesicht mit pulsierenden Ecken scannt und mit einem Haken endet.
Einstellungen
Code
<div class="uvq13-pay"><div class="pr"><i class="im" aria-hidden="true"></i><div><p class="nm">Brisa Kopfhörer</p><p class="pc">49,90 €</p></div><button type="button" class="fire" aria-haspopup="dialog">Kaufen</button></div><div class="ln" aria-hidden="true"><i></i><i></i><i class="s"></i></div><i class="side" aria-hidden="true"></i><div class="scr"></div><div class="sh" role="dialog" aria-modal="true" aria-labelledby="uvq13-pay-t" data-st="idle"><header><b id="uvq13-pay-t">Zur Kasse</b><button type="button" class="x" aria-label="Abbrechen"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 7l10 10M17 7L7 17"/></svg></button></header><div class="mid"><div class="cc" aria-hidden="true"><i class="chip"></i><span>•••• 4242</span></div><dl class="rows"><div><dt>Karte</dt><dd>Debit •••• 4242</dd></div><div><dt>Versand</dt><dd>Calle Mayor 12, Madrid</dd></div><div class="tt"><dt>Summe</dt><dd>49,90 €</dd></div></dl></div><div class="cf"><span class="bio" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><path class="br" d="M4 8V6a2 2 0 0 1 2-2h2M16 4h2a2 2 0 0 1 2 2v2M20 16v2a2 2 0 0 1-2 2h-2M8 20H6a2 2 0 0 1-2-2v-2"/><path class="fc" d="M9 9.5v1.2M15 9.5v1.2M12 9.5v3.5h-1M9.5 15.5c1.4 1.1 3.6 1.1 5 0"/><circle class="ci" cx="12" cy="12" r="9" pathLength="1"/><path class="ck" d="M7.5 12.5l3 3 6-6.5" pathLength="1"/></svg></span><p class="msg" aria-live="polite"><span class="m0">Zweimal drücken zum Bezahlen</span><span class="m1">Noch einmal drücken</span><span class="m2">Wird geprüft…</span><span class="m3">Fertig</span></p><i class="ar" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h13M13 6.5l5.5 5.5-5.5 5.5"/></svg></i></div><button type="button" class="go">Zahlung bestätigen</button></div><p class="tst" aria-live="polite"><span>Bestellung bestätigt</span></p></div>Prompt für KI
Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.
Mehr aus Overlays
Alle ansehen: OverlaysWofür du ihn nutzen kannst
Handy-Wallets bestätigen Zahlungen mit Doppeldruck und Gesichtsscan, und dieses Sheet überträgt den Rhythmus ins Web. Es fährt mit Karte, Versand und Summe hoch, eine angedeutete Seitentaste am Bildschirmrand pulsiert, und zweimal Drücken startet einen Scan, bei dem die Eckklammern pochen, bevor sie zu einem gezeichneten Haken werden. Ein Hinweis bestätigt die Bestellung. Passt zu Checkout-Demos, Fintech-Seiten und App-Prototypen.
Die Hauptfarbe ist der dunkle Button des Sheets, die zweite das Erfolgsgrün. Ausgelöst wird über Seitentaste oder Hauptbutton, per Tastatur zweimal Enter, und Escape bricht in jedem Schritt vor Abschluss der Zahlung ab.