Badge
Badges are used to inform about status or show a numerical value in proximity to notifications or any action that has been taken.
There are 2 types of badges
- Strong
- Light
Use a strong badge to denote quantity, use a light badge to seek mild attention. Both types offer different support variants namely danger, warning, info and success which are available as props.
Badge renders danger variation by default for both Strong and Light badges.
Usage
import Badge from "@asphalt-react/badge"
<Badge value={29} />
<Badge />
Props
value
Numeric value displayed in badge.
type | required | default |
---|
union | false | null |
danger
Applies danger styles
type | required | default |
---|
bool | false | false |
warning
Applies warning styles
type | required | default |
---|
bool | false | false |
info
Applies info styles
type | required | default |
---|
bool | false | false |
success
Applies success styles
type | required | default |
---|
bool | false | false |