Button
Le bouton de Soliguide : une action sur la page, ou un lien qui a l'apparence d'un bouton. Huit couleurs, six styles, cinq tailles.
Vue d'ensemble : color × variant
Réglages
Chaque réglage correspond à une propriété du composant.
La couleur du bouton. « neutral » est pensé pour un fond coloré, pas blanc.
Le style : plein, contour, pointillés, adouci, sans fond ou lien.
La taille, de très petit (xs) à très grand (xl).
Coins arrondis du thème (square) ou forme de pilule (round).
Bouton enfoncé. Il prend l'aspect plein de sa couleur, quel que soit le style.
Bouton désactivé : grisé, et sans action possible.
Une vraie balise bouton, ou un lien (a) qui a l'apparence d'un bouton.
Le texte du bouton. Vide, il ne reste que les icônes.
Une icône avant le texte.
Une icône après le texte.
Le nom lu par les lecteurs d'écran. Obligatoire pour un bouton qui n'a que des icônes.
La destination, quand le bouton est un lien (as = a).
Le rôle dans un formulaire, quand le bouton est un vrai bouton.
Des classes en plus, pour tester une personnalisation.
Le code correspondant
import Button from "@neo/ui/components/Button.astro";
<Button />