Bouton maintenir pour supprimer
Gardez-le enfoncé : il se remplit de rouge, le couvercle de la corbeille tremble et l'action part une fois la barre pleine.
Réglages
Code
<button class="uvq01-hld" type="button"><span class="f" aria-hidden="true"></span><span class="ic" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><g class="lid"><path d="M4 7h16"/><path d="M9.5 7V4.5h5V7"/></g><path d="M6 7l1 13h10l1-13"/><path d="M10 11v5M14 11v5"/></svg></span><span class="w"><span class="t">Maintenir pour supprimer</span><span class="d">Supprimé</span></span></button>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Boutons
Voir tout : BoutonsOù l’utiliser
Les actions destructrices méritent un peu de friction, et ce bouton la demande : il faut le maintenir pendant qu'une barre rouge le traverse de gauche à droite et que le couvercle de l'icône de corbeille se met à trembler. Relâcher trop tôt fait redescendre la barre. Il fonctionne à la souris, au doigt et au clavier, idéal pour supprimer des comptes, fichiers ou projets.
Réglez la durée d'appui avec le curseur de temps ; environ une seconde et demie paraît réfléchi sans agacer. Gardez une couleur principale rouge ou orange pour que le risque se lise d'un coup d'œil, et placez à côté un bouton d'annulation classique.