Boutons

Slide away destructive

Un bouton destructeur dont l'étiquette glisse vers la gauche pour ne laisser qu'une croix, puis se transforme en un visage de réussite avec une coche pendant un instant lorsqu'on appuie dessus.

Hover to collapse the label, press to confirm.

Utiliser Slide away destructive

Un bouton destructeur dont l'étiquette glisse vers la gauche pour ne laisser qu'une croix, puis se transforme en un visage de réussite avec une coche pendant un instant lorsqu'on appuie dessus.

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: label, accent, confirmColor, slideMs, confirmMs

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

2628Icon takeover deleteBoutonsUn bouton destructeur divisé en un mot gras et une cellule d'icône étroite ; le survol ou la mise au point agrandit la cellule sur tout le bouton jusqu'à ce qu'il ne reste que le glyphe, avec une confirmation en deux clics au toucher.

2696Destructive sweep buttonBoutonsUne action de suppression dont les nuances allant du rose au pourpre balayent de bout en bout en survol, inclinant le couvercle de la poubelle, avec une prise facultative pour confirmer la ligne le long du bord inférieur.

2551Staged expand delete buttonBoutonsUne vignette d'icône de corbeille carrée qui s'élargit après un court délai de survol, fait apparaître son étiquette en fondu et demande un deuxième clic de confirmation avant de se déclencher.

2715Glide swap buttonBoutonsUn bouton de largeur fixe qui fait glisser son étiquette du bord droit tandis que le glyphe glisse vers le centre, le tout reposant sur un rebord de couleur dure sur lequel le bouton tombe lorsqu'on appuie dessus.

1707Hold ring confirmBoutonsUn bouton rond entouré d'un trait qui se dessine pendant que vous maintenez le doigt enfoncé, introduisant simultanément une valeur de progression dans l'anneau, l'échelle du bouton et la couleur de l'étiquette.

1636Hold to deleteBoutonsUn bouton destructeur qui ne se déclenche qu'une fois que le pointeur est maintenu enfoncé suffisamment longtemps pour qu'une barre de remplissage le traverse et rembobine dès que vous le relâchez.