Statistics block has 2 primary variations, Statistics and Statistics Grid. Statistics is horizontal in design with 1-3 stats. Statistics Grid will stack the stats two wide, then repeat vertically.
When adding the stats there is code behind the interface adding additional information for users using screen readers. If you use this block outside of it purpose there may be unintended accessibility issues.
Statistics
Introduction
The standard intro section with Title, subtitle, content and alignment for the titles.
Statistics
Each stat has the option for prefix, number, suffix, statistic text, source, and styling option to make the font smaller.
Configuration
Two main settings to be aware of.
- Statistics style
Standard, or circles. Standard is basic text display, where circles will animate a graph as people scroll on the page. Keep in mind circles only works if the stats make sense in the 1-100 scale.
- Background
There are pre-set selection. In the event two stat blocks are stacked the background should be set to gray.
Statistics – Grid
The statistics grid block can work with more stats. Recommended number is 4 however it may look fine with 6 when there is enough text in the content section to match the height of the stats.
Introduction
The standard intro section with Title, subtitle, content and alignment for the titles.
Statistics
Each stat has the option for prefix, number, suffix, statistic text, source, and styling option to make the font smaller.
Configuration
Two main settings to be aware of.
- Statistics style
Standard, or circles. Standard is basic text display, where circles will animate a graph as people scroll on the page. Keep in mind circles only works if the stats make sense in the 1-100 scale.
- Background
There are pre-set selections.