Etiquetas de talla colgantes
Etiquetas de papel kraft colgadas de un cordel: la talla elegida se tiñe de rojo y se balancea un momento.
Ajustes
Código
<fieldset class="uvq04-tag"><legend>Talla</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">La XS está agotada</p></fieldset>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Radio buttons
Ver todos: Radio buttonsDónde usarlo
Las tallas de ropa se convierten en etiquetas de papel kraft colgadas de un cordel que cede un poco, cada una con su ojal y una letra gruesa. Al elegir una se vuelve roja y se balancea como un péndulo que se frena, y las tallas agotadas se apagan tachadas. Da un aire de tienda artesanal a moda, merchandising y configuradores de producto.
El color principal es la etiqueta elegida y el secundario el cordel. Los inputs deshabilitados controlan el stock: añade o quita el atributo disabled en cada talla y actualiza la nota de abajo para explicar por qué una etiqueta sale en gris.