Ankündigungsleiste oben
Eine Leiste oben mit durchlaufendem Lichtschimmer, Link zur Neuheit und einem X, das sie einklappt.
Einstellungen
Code
<div class="uv-oab"><div class="bn" role="region" aria-label="Ankündigung"><div class="in"><span class="tg">Neu</span><span class="tx">Neu: Rechnungsvorlagen mit deinem Logo</span><a href="#">Neuigkeiten ansehen</a><button type="button" class="x" aria-label="Ankündigung schließen"><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></div></div><div class="ap"><div class="nb"><i></i><i></i><i></i></div><div class="pg" aria-hidden="true"><i class="h"></i><i></i><i></i><i></i><i></i><i class="s"></i></div></div><button type="button" class="fire">Banner zeigen</button></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
Launches, Sales oder geänderte Bedingungen verdienen oft eine schmale Leiste über der Navigation statt eines Popups. Diese nutzt einen Verlauf zwischen deinen zwei Farben mit sanft durchlaufendem Glanz, ein Neu-Tag, die Nachricht und einen Link. Beim Schließen klappt die Höhe weich zusammen, der Inhalt rückt also nach oben statt zu springen.
Das Einklappen animiert Grid-Zeilen und funktioniert daher mit jeder Textlänge. Speichere das Schließen auf deiner Seite, damit wiederkehrende Besucher dieselbe Leiste nicht erneut sehen. So bleibt sie eine Neuigkeit.