@cobalto/button

Installation

npm i @magnetita/button --save-dev

Properties

const props = {
  hasIcon: false,
  hasObject: false,
  iconName: "info",
  text: "Saiba tudo sobre este cartão",
  href: "https://www.foregon.com/solicitar/cartaodecredito/next/fgn/cartao-de-credito-next-visa-internacional/1470",
  className: ["primary", "pressed"],
}

Pug

+button({
  text: "Saiba tudo sobre este cartão",
  className: ["primary"],
})

Basic HTML Structure

<button class="u-inline-flex c-button o-center c-button--primary">
  <span>Saiba tudo sobre este cartão</span>
</button>

Styles

@import '@magnetita/button/button.scss';

CSS Classes

CSS Class | Description --- | --- c-button | c-button--raised | c-button--pressed | c-button--primary | c-button--secondary |

Dependencies

Objects Classes

CSS Class | Description --- | --- o-icon | o-center |

Functional Classes

CSS Class | Description --- | --- u-inline-flex |

NOTE: @magnetita/objects and @magnetita/utility built this component

Variants

Raised

c-button--raised

Pressed

c-button--pressed

Primary

c-button--primary

Secondary

c-button--secondary