@fantassin/button v1.1.1
Button
Présentation
L'élément HTML est utilisé afin de créer un contrôle interactif ayant la forme d'un bouton et qui pourra être utilisé dans un formulaire ou dans le document.
Par défaut, les boutons HTML sont mis en forme avec les styles natifs provenant du système d'exploitation mais leur apparence peut être adaptée grâce à CSS. En savoir plus
Utilisation
Il existe actuellement 4 type de boutons :
- default :
- ghost :
- link :
- file
Paramètres utilisables :
Les variables
Voici les variables par défaut
Nom | Valeur |
---|---|
$button-color | #000 !default |
$button-bg-color | #00FFC6 !default |
Vous pouvez les modifier pour avoir les couleurs de votre charte.
Les options
Pour utiliser un bouton vous pouvez faire ceci @include button(params);
pour avoir le type de bouton voulu. Néanmoins si vous faites @include button();
, vous aurez le bouton default (plain).
Les paramètres params
peut contenir ces différentes valeurs :
Paramètres | Description |
---|---|
ghost | Déplace la blockquote du côté droit, si le type de la blockquote le permet |
link | Créé une blockquote de type pull-quote |
Attention pour avoir un button de type file, la mixin est différente. Il faut faire ceci @include button-file()
Vous pouvez également faire @include button-file('dark')
pour avoir une version sombre.
Installation
Pour importer le composant dans votre projet, il vous faut au préalable node
.
npm i git+ssh://git@gitlab.com:bazooka/button
Puis importer les blockquotes dans votre scss avec : @import "node_modules/@bazooka/button/button"
;
Développement
Le développement se fait sur la branche develop
.
Changelog
Le format du changelog est calqué sur Keep a Changelog, tout en suivant la norme Semantic Versioning.
1.0.0 - 27/12/2018
Added
- Material Icons Font
- Initial materialIcons mixin
6 years ago