Status
|
|
Default It's the default status |
Disabled When the counter is used in an actionable component that is in a disabled state. |
Inactive When the counter is not being used for any action and can't evolve. |
|
Brand (selected) |
|
|
|
|
System (by default) |
|
|
|
|
Primary |
|
|
|
|
Secondary |
|
|
|
|
Danger |
|
|
|
|
Warning |
|
|
|
|
Success |
|
|
|
|
Premium |
|
|
|
|
Jupiter |
|
|
|
|
Neptune |
|
|
|
|
Earth |
|
|
|
|
Cloudy |
|
|
|
|
Reverse |
|
|
|
|
Neutral |
|
|
|
Join context and status with color
Depending on how they are used, the counters will have different colors. The context can change the way we want to represent counters.
Concret case : Tab
By default, tabs with counter use the "system" color, but when the tab is selected, its color is replaced by the "brand" color.
However, if you need to add a different meaning depending on the context, you can change these colors.
|
|
|