Messages d’état

Toast stack

Une pile de notifications de coin où les toasts les plus anciens se placent derrière les plus récents, les pointant vers eux dans une liste, et chacun draine une racine des cheveux avant de partir.

Hovering the stack fans it out and holds each countdown.

Utiliser Toast stack

Testez l’aperçu avec la souris et le clavier, puis vérifiez la visibilité du focus et la mise en page sur un écran étroit. Indiquez le numéro ou l’identifiant du composant à votre agent de programmation.

Propriétés: position, maxVisible, duration

Quels frameworks sont disponibles ?

Le catalogue propose ces versions : react, vue, svelte, astro, html. L’aperçu de cette page utilise React.

Comment accéder à l’implémentation ?

Le code, les portages, l’installation et le panneau de propriétés sont inclus dans Fieldbook Pro. L’aperçu interactif est ouvert à tous.

Connectez votre agent

Composants proches

2240Stacked notification trayMessages d’étatUne pile de cartes de notification de type téléphone qui se déploie en une liste lisible lorsque vous appuyez dessus et se replie en un seul jeu.

1937Click ripple burstMessages d’étatUn effet de retour de pointeur qui génère une brève forme animée exactement à l'endroit où l'utilisateur clique ou appuie.

2122Click spark burstMessages d’étatChaque presse projette un anneau de lignes courtes à partir du point de contact exact, chacune s'étirant et se rétrécissant à mesure qu'elle vole.

2055Stacked notification drawerMessages d’étatUne pile compacte de cartes de notification qui se cache derrière sa carte supérieure jusqu'à ce qu'elle soit planée, puis se déploie en une liste entièrement lisible avant de se replier.

2117Breathing dot loaderMessages d’étatLes points qui restent en place et respirent au lieu de bouger, gonflent et s'assombrissent à leur tour, de sorte que la rangée se lit comme un battement de cœur lent.

2129Content Loading CardMessages d’étatUn espace réservé en forme de carte qui respire avec une lente impulsion d'opacité pendant qu'un grand bloc d'image et deux lignes de texte sont toujours en cours de chargement.