<!-- Chevron Down -->
<span class="icon-chevron-down icon-before">chevron-down</span>
<!-- Plus -->
<span class="icon-plus icon-before">plus</span>
<!-- Minus -->
<span class="icon-minus icon-before">minus</span>
<!-- Close -->
<span class="icon-close icon-before">close</span>
<!-- Bars -->
<span class="icon-bars icon-before">bars</span>
<!-- Arrow Right -->
<span class="icon-arrow-right icon-before">arrow-right</span>
<span class="icon-{{ _self.name }} {{ icon_class }}">{{ _self.name }}</span>
/* Chevron Down */
{
"icon_class": "icon-before"
}
/* Plus */
{
"icon_class": "icon-before"
}
/* Minus */
{
"icon_class": "icon-before"
}
/* Close */
{
"icon_class": "icon-before"
}
/* Bars */
{
"icon_class": "icon-before"
}
/* Arrow Right */
{
"icon_class": "icon-before"
}
| Base Class | Description |
|---|---|
.icon-[name] |
Use any of the named icons. |
| Optional Class | Description |
|---|---|
.icon-before |
Position icon before with flexbox |
.icon-after |
Position icon after with flexbox |
.icon-align-top |
Align icon to top |
.icon-align-bottom |
Align icon to bottom |
.icon-orange |
Orange icon color |
.icon-white |
White icon color |