Badge

MSK Badge는 짧은 상태, 라벨, 카운트를 표시하는 CSS-first primitive입니다. 상호작용이 필요한 명령은 badge가 아니라 button 또는 menu item으로 구성합니다.

Preview

DraftActivePendingBlocked

Usage

<span class="msk-ui-badge">Draft</span>
<span class="msk-ui-badge" data-type="success">Active</span>
<span class="msk-ui-badge" data-type="warning">Pending</span>
<span class="msk-ui-badge" data-type="danger">Blocked</span>