Tor-Toast mit La Ola
Fällt ein Tor, springt der Spielstand um eins hoch und die Tribüne macht La Ola; ein Button lässt das Publikum sie wiederholen.
Einstellungen
Code
<div class="uvq09-gol"><button type="button" class="fire">Noch ein Tor</button><div class="tt" role="status"><span class="std" aria-hidden="true"><i class="lt l1"></i><i class="lt l2"></i><i class="fa" style="--c:0;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:1;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:2;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:3;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:4;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:5;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:6;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:7;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:8;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:9;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:10;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:11;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:12;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:13;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:14;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:15;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:0;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:1;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:2;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:3;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:4;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:5;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:6;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:7;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:8;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:9;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:10;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:11;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:12;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:13;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:14;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:15;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:0;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:1;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:2;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:3;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:4;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:5;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:6;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:7;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:8;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:9;--k1:var(--c2);--k2:var(--c2)"></i><i class="fa" style="--c:10;--k1:#e2e8f0;--k2:var(--c1)"></i><i class="fa" style="--c:11;--k1:var(--c1);--k2:var(--c2)"></i><i class="fa" style="--c:12;--k1:var(--c2);--k2:var(--c1)"></i><i class="fa" style="--c:13;--k1:#e2e8f0;--k2:var(--c2)"></i><i class="fa" style="--c:14;--k1:var(--c1);--k2:var(--c1)"></i><i class="fa" style="--c:15;--k1:var(--c2);--k2:var(--c2)"></i></span><div class="sc"><span class="sr">Spanien 2, Frankreich 1</span><span class="tm" aria-hidden="true"><i class="fl es"></i>ESP</span><span class="nm h" aria-hidden="true"><span class="rl"><b>1</b><b>2</b></span></span><span class="sp" aria-hidden="true">–</span><span class="nm" aria-hidden="true"><span class="rl"><b>1</b></span></span><span class="tm" aria-hidden="true">FRA<i class="fl fr"></i></span></div><div class="ft"><span class="tx"><b>Tor für Spanien</b><small>Minute 78 · Vorlage von Olga</small></span><button type="button" class="wv">La Ola starten</button></div></div></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 Toasts
Alle ansehen: ToastsWofür du ihn nutzen kannst
Liveticker-Apps melden den ganzen Tag Tore, und dieser Toast bringt Stadionstimmung hinein. Eine kleine Tribüne mit 48 Fans aus CSS liegt unter zwei Flutlichtern, und jede Spalte erhebt sich etwas später, sodass die Welle von einem Ende zum anderen läuft. Der Heimstand rollt mit federndem Sprung auf die neue Zahl. Passend für Sport-Apps, Fantasy-Ligen und Liveblogs.
Die beiden Farben gehören dem Heimteam: Sie färben Flagge, Trikots im Publikum und die Schals, die bei der Welle hochgehen. Der echte Spielstand steht in einer versteckten Zeile für Screenreader; tausche Teams, Minute und Vorlage gegen die Daten deines Spiels.