Étiquettes de taille suspendues
Des étiquettes en papier kraft suspendues à une ficelle : la taille choisie devient rouge et se balance un instant.
Réglages
Code
<fieldset class="uvq04-tag"><legend>Taille</legend><div class="rp"><i class="cd" aria-hidden="true"></i><label><input type="radio" name="uvq04-tag" disabled><span class="tg"><b>XS</b></span></label><label><input type="radio" name="uvq04-tag"><span class="tg"><b>S</b></span></label><label><input type="radio" name="uvq04-tag" checked><span class="tg"><b>M</b></span></label><label><input type="radio" name="uvq04-tag"><span class="tg"><b>L</b></span></label><label><input type="radio" name="uvq04-tag"><span class="tg"><b>XL</b></span></label></div><p class="nt">Le XS est épuisé</p></fieldset>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 radio
Voir tout : Boutons radioOù l’utiliser
Les tailles de vêtement deviennent des étiquettes en papier kraft enfilées sur une ficelle un peu détendue, chacune avec son œillet et une lettre épaisse. Au survol, l'étiquette penche ; une fois choisie, elle devient rouge et se balance comme un pendule qui s'amortit, tandis que les tailles épuisées pâlissent, barrées. Une touche de boutique artisanale pour la mode et le merch.
La couleur principale colore l'étiquette choisie et la secondaire la ficelle. Les inputs désactivés gèrent le stock : ajoute ou retire l'attribut disabled pour chaque taille et mets à jour la note du dessous pour expliquer pourquoi une étiquette est grisée.