Überlagerungen

Dismissible Dialog

Ein universeller zentrierter Dialog, der vor einem unscharfen Hintergrund geöffnet wird und durch die Schaltfläche „Schließen“, den Hintergrund oder Escape einfach geschlossen werden kann.

Harbor

Project settings

Owner

Visibility: Private
Members: 6 people
Storage used: 2.4 GB of 10 GB

Danger zone

Deleting a project cannot be undone.

Dismissible Dialog verwenden

Ein universeller zentrierter Dialog, der vor einem unscharfen Hintergrund geöffnet wird und durch die Schaltfläche „Schließen“, den Hintergrund oder Escape einfach geschlossen werden kann.

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: heading, detail, accentColor, confirmLabel

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Vorschau und Beschreibung sind öffentlich. Melde dich mit einem berechtigten Konto an, um Code, Framework-Versionen und Installation zu öffnen.

Verbinde deinen Agenten

Ähnliche Komponenten

2324Confirm action modalÜberlagerungenEin zentrierter Bestätigungsdialog, der sich über einem dunkler werdenden Hintergrund öffnet und den Besucher auffordert, eine destruktive Aktion zu bestätigen oder abzubrechen.

1919Banner header dialogÜberlagerungenEin modales Fenster mit einem farbigen Bannerstreifen am oberen Rand, das sich über einer abgeblendeten und völlig inaktiven Kopie der Seite dahinter befindet.

2119Centered modal frameÜberlagerungenEin einfaches, zentriertes Modal, das vor einem abgedunkelten Hintergrund ausgeblendet und skaliert wird, mit Kopf-, Haupt- und Fußzeile, für alltägliche Formulare und Bestätigungen.

2204Perspective reveal dialogÜberlagerungenEin Allzweckdialog, dessen Bedienfeld von einer ausgewählten Kante in 3D nach innen geneigt und dann abgeflacht wird, um beliebigen Inhalt auf einer abgeblendeten Seite anzuzeigen.

2419Scrollable modal dialogÜberlagerungenEin allgemeines Modal mit einer Kopfzeile, einem Textkörper, der unabhängig scrollt, sobald sein Inhalt überläuft, und einer Fußzeile, die durch eine eigene Schließen-Schaltfläche, einen externen Klick oder Escape geschlossen werden kann.

2041Slide up panel dialogÜberlagerungenEin zentrierter Dialog, der über einem gedimmten Geflecht entsteht, für jeden Inhalt, der einen Moment voller Aufmerksamkeit erfordert.