<button class="button dropdown-button has-icon--right tiny is-appealed " href="#" aria-expanded="false">
<span class="ui-icon ui-small" aria-hidden="true">
<svg>
<use xlink:href="#i-arrow-down"></use>
</svg>
</span>
Button
</button>
<ul class="dropdown-menu" role="listbox" aria-hidden="true" aria-activedescendant tabindex="-1">
<li class="dropdown-menu_item is-processing" role="option" aria-selected="false"><a href="#">This is a link</a></li>
<li class="dropdown-menu_item is-approved" role="option" aria-selected="false"><a href="#">This is another</a></li>
<li class="dropdown-menu_item is-disqualified is-selected" role="option" aria-selected="true"><a href="#">Yet another</a></li>
</ul>
<button class="button dropdown-button has-icon--right tiny is-appealed {{default classes ''}}" href="#" aria-expanded="false">
<span class="ui-icon ui-{{default scale 'small'}}" aria-hidden="true">
<svg>
<use xlink:href="#i-{{default icon 'arrow-down'}}"></use>
</svg>
</span>
{{default text 'Button'}}
</button>
<ul class="dropdown-menu" role="listbox" aria-hidden="true" aria-activedescendant tabindex="-1">
<li class="dropdown-menu_item is-processing" role="option" aria-selected="false"><a href="#">This is a link</a></li>
<li class="dropdown-menu_item is-approved" role="option" aria-selected="false"><a href="#">This is another</a></li>
<li class="dropdown-menu_item is-disqualified is-selected" role="option" aria-selected="true"><a href="#">Yet another</a></li>
</ul>
{
"modifiers": [
"normal",
"primary",
"secondary",
"tertiary",
"alert",
"alert-fill",
"tint",
"deep",
"tiny is-leased",
"tiny is-waitlisted",
"tiny is-processing",
"tiny is-approved",
"tiny is-withdrawn",
"tiny is-disqualified",
"tiny is-appealed",
"ghost-white",
"large",
"tall",
"small",
"tiny",
"expand",
"disabled",
"button-link"
],
"icons": [
"arrow-down",
"download",
"forward",
"info",
"like"
]
}
There are no notes for this item.