Button
Demo
HTML
<button class="c-button">Button</button>
Modifier Classes
<button class="c-button c-button--secondary">Button</button>
Sass Variables
$c-button--disabled: $s-color--button--disabled !default;
$c-button--submit-color: #f2516b !default; //cep watermellon
$c-button--primary: $s-color--button !default;
$c-button--primary-hover: $s-color--button--hover !default;
$c-button--primary-active: $c-button--primary-hover !default;
$c-button--secondary-color: #000 !default;
$c-button--secondary: $s-color--secondary !default;
$c-button--secondary-hover: darken(desaturate($s-color--secondary, 2.58), 9.22) !default;
$c-button--secondary-active: $c-button--secondary !default;
$c-button--tertiary: $s-color-tertiary !default;
$c-button--tertiary-hover: #fff !default;
$c-button--tertiary-active: $s-color-tertiary !default;
component varaibles default from colors set in settings/color.scss