Button

Javascript

Fonctions Description
sk.Button.loadOn(button) Désactive et ajoute une loader au bouton
sk.Button.loadOff(button) Active et enlève le loader au bouton

Exemples

Bouton par défaut

Défaut

Défaut 
<button>Défaut</button>
<p class="btn">Défaut</p>
<a href="#" class="btn">Défaut</a>

Couleurs

Red p

Red a

Red p

Red a 
<div>
    <button class="bgRed">Bouton</button>
    <p class="btn bgRed">Red p</p>
    <a href="#" class="btn bgRed">Red a</a>
</div>
<div>
    <button class="bgYellow dark">Bouton</button>
    <p class="btn bgYellow dark">Red p</p>
    <a href="#" class="btn bgYellow dark">Red a</a>
</div>

Taille

<button class="bgBlue">Défaut</button>
<button class="btnL   bgBlue">Bouton L</button>
<button class="btnXL  bgBlue">Bouton XL</button>
<button class="btnXXL bgBlue">Bouton XXL</button>

Décoration

Shadow

Shadow hover 
<button class="bgBlue radius">Radius</button>
<button class="bgBlue rounded">Rounded</button>
<p class="btn bgBlue shadow">Shadow</p>
<a href="#" class="btn bgBlue shadow shadowHover">Shadow hover</a>
<button class="bd1 bdRed radius">Border 1</button>
<button class="bd2 bdColor1 bgTransparent color1 radius">Border 2 <i class="iconMiddle" data-icon="fal/chevron-right"></i></button>

Icônes

Button

Button

<button><i class="iconMiddle" data-icon="fal/search"></i> Button</button>
<p class="btn bgColor1">Button <i class="iconMiddle" data-icon="fal/chevron-right"></i></p>
<p class="btn rounded"><i class="iconMiddle color1" data-icon="fal/check"></i> Button</p>

Loading

Red p

Red a 
<button class="radius loading">Bouton</button>
<p class="btn bgRed rounded loading">Red p</p>
<a href="#" class="btnXL bgRed loading shadow shadowHover">Red a</a>