States

States, or state indicators, inform users of the current status of a particular item. Included common states are In Progress, Canceled, or Complete, each requiring it’s own modifier class.

Open (green)

Open Open
<span class="state state-open">Open</span>
<span class="state state-inprogress">Open</span>

Closed (red)

Canceled
<span class="state state-canceled">Canceled</span>

Merged (purple)

Complete
<span class="state state-complete">Complete</span>