Überlagerungen

Pop scale panel

Ein Popover, das aus halber Größe aufspringt, einen kleinen Pfeil zurück auf seinen Auslöser zeigt, die Seite dahinter abdunkelt und sich bei Escape oder einem Klick von außen schließt.

Workspace

Design review

Cover artOnboardingPricing pageEmpty states

Click the trigger again, press Escape, or click outside to close it.

Pop scale panel verwenden

Ein Popover, das aus halber Größe aufspringt, einen kleinen Pfeil zurück auf seinen Auslöser zeigt, die Seite dahinter abdunkelt und sich bei Escape oder einem Klick von außen schließt.

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: side, align, showArrow, dimBackdrop, accent

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

1913Anchored settings popoverÜberlagerungenEine Schaltfläche, die ein kleines Einstellungsfeld öffnet, das daneben verankert ist und sich von der Ecke aus erstreckt, die dem Auslöser am nächsten liegt, und die Seiten umdreht, wenn der Platz knapp wird.

1911Anchored info popoverÜberlagerungenEine Auslöseschaltfläche, die ein kleines schwebendes Infofeld öffnet, das an einem seiner Ränder verankert ist, von diesem Rand aus ausgeblendet und vergrößert wird und bei einem Klick oder Escape von außen wieder ausgeblendet wird.

1912Anchored popover cardÜberlagerungenEine Auslösetaste, die eine kleine Einstellungskarte öffnet, die an sich selbst verankert ist, sich vom Rand aus verkleinert und bei einem zweiten Klick, Escape oder einem Druck von außen schließt.

2300App folder expandÜberlagerungenEine Ordnerkachel im Startbildschirm-Stil, deren kleine App-Symbole zu einem vollständigen Bedienfeld wachsen, wobei jedes Symbol von seiner Miniaturansicht zu seiner großen Position wandert.

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.

2335Dismissible DialogÜberlagerungenEin 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.