Numeric Widget
The numeric widget displays numeric text. The number can be static text or it can be a dynamic widget value
The number text will be dynamically scaled according to the size of the widget and will be centered by default.
Configurable components
| Class Name | Description |
|---|---|
| card | Numeric widget card component |
| primary | Primary numeric component |
Widget Properties
| Name | Description |
|---|---|
| prefix | Optional prefix text to display before the text |
| suffix | Optional suffix text to display after the text |
| text | Alternate numeric text to display |
| value | Widget numeric data value to display |
Common CSS Properties
| Property | Description |
|---|---|
| font-size | Set the font size of the numeric text. Defaults to max(10px, min(min(18cqw, 18cqh), 144px)) |
| font-weight | Set the font weight of the numeric text. Defaults to bold. |
| background | Background color |
| color | Text color |
| justify-content | Set to left to left align the text. |
| prefix.font-size | Set the font size of the prefix text. Defaults to max(10px, min(min(5cqw, 5cqh), 36px)) |
| suffix.font-size | Set the font size of the suffix text. Defaults to max(10px, min(min(5cqw, 5cqh), 36px)) |