Composant de liste de boutons

Image et icône

Si vous souhaitez définir une icône, vous devez laisser le champ image vide.

Et si vous voulez placer l'image/l'icône à droite, appliquez ce qui suit à CSS de l'image du bouton

left: auto;
right: .5rem;

Structure DOM

Un composant Liste de boutons est composé comme ceci dans la structure DOM HTML.

<div style="display: flex; width: 100%"> <!-- CSS applies here -->
  <a href="" ...> <!-- CSS du bouton applies here-->
    <div
      style="position: absolute; top: .5rem; bottom: .5rem; overflow: hidden; left: .5rem;"
      <!-- CSS de l'image du bouton applies here-->
    >
      {image || icon}
    </div>
    <span>
      {button text}
    </span>
  </a>
  ...
</div>