Odyssey styleguide

Icon Button

Toggle example guides Toggle HTML markup

<insert-markup>components.button.icon-</insert-markup>
.odyssey-button--primary
Primary button
<insert-markup>components.button.icon-0</insert-markup>
.odyssey-button--secondary
Secondary button
<insert-markup>components.button.icon-1</insert-markup>
.odyssey-button--links
Large link button
<insert-markup>components.button.icon-2</insert-markup>
.odyssey-button--error
Error Button
<insert-markup>components.button.icon-3</insert-markup>
.odyssey-button--accent
Accent Button
<insert-markup>components.button.icon-4</insert-markup>
Markup 
<button class="odyssey-button odyssey-button--icon [modifier class]"><i class="odyssey-button__icon"></i>Download</button>
<button class="odyssey-button odyssey-button--icon odyssey-button--large [modifier class]"><i class="odyssey-button__icon"></i>Download</button>
<button class="odyssey-button odyssey-button--icon odyssey-button--small [modifier class]"><i class="odyssey-button__icon"></i>Download</button>
<button class="odyssey-button odyssey-button--icon [modifier class]" disabled><i class="odyssey-button__icon"></i>Download</button>
Source: src/components/button.less, line 363