Menu

Button - Blue

<button type="button" class="mp c-button c-button--blue" >Button</button>
{
"label": "Button",
"colour": "blue"
}

Props

Name Type Description
label string
link string Converts from a button an anchor
colour string eg. "red", "outline-green"
inline bool Is the button inline-flex or flex?
classes string Additional class attributes
attrs string Addtional HTML attributes

CSS modifiers

Name Description
c-button--inline Makes the button inline-flex
c-button--[colour] petrol, red, blue, white, outline-green, outline-white
c-button--small Shrinks the button
c-button--wide Makes the button 100% width
c-button--tight Reduces the left/right padding
c-button--loading Replace the button text with a loading indicator