Tooltip mit Vorschau
Beim Hovern über einen Link öffnet sich eine kleine Karte mit Icon, Titel, letzter Änderung und Status.
Einstellungen
Code
<button class="uv-tv">Vorschau<span><i>⌁</i><b>Projekt Atlas</b><small>Vor 2 Min. aktualisiert</small><em>In Arbeit</em></span></button>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 Tooltips
Wofür du ihn nutzen kannst
Denk an ein Aufgaben-Tool, in dem Projekte ständig erwähnt werden: in Kommentaren, im Aktivitätsverlauf, in der Wochenübersicht. Statt jedes einzeln zu öffnen, fährst du über den Namen und siehst „Projekt Atlas · vor 2 Min. aktualisiert · In Arbeit“. Eine Hover-Card, also ein Tooltip mit Vorschau, wie man ihn von GitHub oder Notion kennt.
Mehr als drei oder vier Angaben sollten nicht hinein; braucht die Karte einen Scrollbalken, ist sie eigentlich eine Seite. In langen Listen hilft eine kleine Verzögerung, damit nicht bei jeder Zeile eine Karte aufpoppt, nur weil die Maus vorbeikommt.