Buttons

Basic examples

  • Default
  • Outlined
  • Text
  • Full width
  • Disabled
  • Small
  • X-small
Show code
<button type="button" class="button -default">Ajouter un contrat</button>
<button type="button" class="button -outlined">Ajouter un contrat</button>
<button type="button" class="button -text">Ajouter un contrat</button>
<button type="button" class="button -fullWidth">Ajouter un contrat</button>
<button type="button" class="button -disabled">Ajouter un contrat</button>
<button type="button" class="button -small">Ajouter un contrat</button>
<button type="button" class="button -x-small">Ajouter un contrat</button>

Blinking

  • Default
Show code
<button type="button" class="button -red -blinking">Ajouter un contrat</button>

Colors

  • Default
  • Green
  • Dark Blue
  • Red
  • Yellow
Show code
<button type="button" class="button -default">Ajouter un contrat</button>
<button type="button" class="button -green">Ajouter un contrat</button>
<button type="button" class="button -darkBlue">Ajouter un contrat</button>
<button type="button" class="button -red">Ajouter un contrat</button>
<button type="button" class="button -yellow">Ajouter un contrat</button>

Group

  • Default
  • Disabled
Fille
Garçon
Fille
Garçon
Show code
<div class="buttonsGroup"> <div class="button"><input type="radio" name="sex" value="fille"> <span>Fille</span></div> <div class="button"><input type="radio" name="sex" value="garçon"> <span>Garçon</span></div> </div>
<div class="buttonsGroup"> <div class="button -disabled -current"><input type="radio" name="sex" value="Fille" disabled checked><span>Fille</span></div> <div class="button -disabled"><input type="radio" name="sex" value="Garçon" disabled><span>Garçon</span></div> </div>