graycoreio/daffodil

<h4>Basic Status Buttons</h4>
<div class="statusable-button__group">
    <button daff-button status="warn">Warn</button>
    <button daff-button status="critical">Critical</button>
    <button daff-button status="success">Success</button>
</div>

<h4>Stroked Status Buttons</h4>
<div class="statusable-button__group">
    <button daff-stroked-button status="warn">Warn</button>
    <button daff-stroked-button status="critical">Critical</button>
    <button daff-stroked-button status="success">Success</button>
</div>

<h4>Raised Status Buttons</h4>
<div class="statusable-button__group">
    <button daff-raised-button status="warn">Warn</button>
    <button daff-raised-button status="critical">Critical</button>
    <button daff-raised-button status="success">Success</button>
</div>

<h4>Underline Status Buttons</h4>
<div class="statusable-button__group">
    <button daff-underline-button status="warn">Warn</button>
    <button daff-underline-button status="critical">Critical</button>
    <button daff-underline-button status="success">Success</button>
</div>

<h4>Icon Status Buttons</h4>
<div class="statusable-button__group">
    <button daff-icon-button status="warn"><fa-icon [icon]="faExclamation"></fa-icon></button>
    <button daff-icon-button status="critical"><fa-icon [icon]="faExclamationTriangle"></fa-icon></button>
    <button daff-icon-button status="success"><fa-icon [icon]="faCheckCircle"></fa-icon></button>
</div>