Buttons
Use buttons of different styles, sizes and types for actions in forms, navigations etc.
Sizes:
Types:
Lighter version: (with ‘is–light’ class)
// All buttons
<button class="app-button is--default">Default</button>
<button class="app-button is--primary">Primary</button>
<button class="app-button is--success">Success</button>
<button class="app-button is--danger">Danger</button>
<button class="app-button is--warning">Warning</button>
<button class="app-button is--info">Info</button>
<button class="app-button is--light">Light</button>
<button class="app-button is--medium">Medium</button>
<button class="app-button is--dark">Dark</button>
// Sizes
<button class="app-button is--success is--small">Small</button>
<button class="app-button is--danger">Default</button>
<button class="app-button is--warning is--large">Large</button>
<button class="app-button is--success is--large is--fullwidth">Full Width</button>
// Types
<button class="app-button is--info is--rounded">Rounded</button>
<button class="app-button is--warning" disabled>Disabled</button>
<button class="app-button is--primary is--outlined">Primary outlined</button>
// Lighter version
<button class="app-button is--primary is--light">Primary</button>
<button class="app-button is--success is--light">Success</button>
<button class="app-button is--danger is--light">Danger</button>
<button class="app-button is--warning is--light">Warning</button>
<button class="app-button is--info is--light">Info</button>