«Ideas para el viaje a Oporto: librería Lello a primera hora y cena junto al río.»
Toast aus gefaltetem Papier
Der Hinweis kommt wie ein Brief dreifach gefaltet an und öffnet sich Falz für Falz, mit Schatten an jeder Knickstelle.
Einstellungen
Code
<div class="uvq09-ori"><button type="button" class="fire">Erneut zeigen</button><div class="tt" role="status"><div class="p p1"><span class="av" aria-hidden="true">A</span><b>Ana hat eine Notiz mit dir geteilt</b><div class="p p2"><p>„Ideen für die Porto-Reise: früh in die Buchhandlung Lello und Abendessen am Fluss.“</p><div class="p p3"><button type="button" class="x">Später</button><button type="button" class="op">Notiz öffnen</button></div></div></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
Eine geteilte Notiz fühlt sich mehr wie ein Brief an, wenn sie sich entfaltet. Dieser Toast besteht aus drei ineinander verschachtelten Papierfeldern: Zuerst erscheint der Kopf, dann klappt das Mittelteil mit einer 3D-Drehung von hinten herunter, danach die Aktionsleiste, jeweils mit einem Schatten, der beim Glätten verschwindet. Beim Schließen faltet er sich rückwärts zusammen. Gut für geteilte Dokumente und Nachrichten.
Die Hauptfarbe gilt für Avatar und Hauptbutton, die zweite für das Papier. Gib jedem Feld eine Aufgabe, also Titel, Vorschau und Aktionen, und passe die Verzögerungen der Übergänge an, wenn du einen Falz ergänzt oder entfernst.