Component
Stat List
SCSS Location: /styles/scss/partial/_stat-list.scss- Status: Design
- Status: Development
- Status: Documentation
Description
A section comprised of multiple statistic components.
Guidelines
Item Design Guidelines Not Provided
Usage
There are multiple varieties of Stat Lists:
- Simple: Card-based design with green background that wraps to the container width. 2-up on mobile/tablet, 4-up on desktop.
- Simple Blue: Same as simple but with blue background and light text colors.
- Bold Stat List: Statistics will break into 2 columns at 375px and above and 4 columns at 992px and above and display dividers when in multiple columns.
- Donut Stat List: Animated Donut Stat List
Stat List | Simple
150+
16,000
$57,700
640
$57,700
16,000+
640
Stat List | Simple Blue
150+
16,000
$57,700
640
$57,700
16,000+
640
Bold Stat List - 3 Stats
-
40+
Faucibus habitant arcu et gibberish -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et
Bold Stat List - 4 Stats
-
40+
Faucibus habitant arcu et gibberish -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et -
195+
Faucibus habitant arcu et
Bold Stat List - 5 Stats
-
40+
Faucibus habitant arcu et gibberish -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et -
195+
Faucibus habitant arcu et -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et gibberish
Bold Stat List - 8 Stats
-
40+
Faucibus habitant arcu et gibberish -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et -
195+
Faucibus habitant arcu et -
700M+
Faucibus habitant arcu et -
60%
Faucibus habitant arcu et gibberish -
40+
Faucibus habitant arcu et gibberish -
700M+
Faucibus habitant arcu et
