Statistic
A statistic emphasizes the current value of an attribute.
definitions/views/statistic.less component is not enabled by default. It can be enabled in the WordPress admin dashboard under Chap Theme -> Chap Compiler.| Classes |
|
| Classes |
| ||||||||
label | Name of the attribute. | ||||||||
pos | Label position [before|after] (default: after). | ||||||||
icon | Name of the icon to use. | ||||||||
image | URL of the image to use. |
<statistic label="Downloads">5,500</statistic><statistic label="Views" pos="before">37,238</statistic><statistics>
<statistic label="Faves">49</statistic>
<statistic label="Views">78,435</statistic>
<statistic label="Members">3,858</statistic>
</statistics>thousand
23<statistics>
<statistic label="Saves">39</statistic>
<statistic text label="Signups">Three{lt}br/{gt}thousand</statistic>
<statistic label="Flights" icon="plane">5</statistic>
<statistic label="Team members" image="/avatars/1s.png">23</statistic>
</statistics>billion
<statistic horizontal label="Downloads">5,693</statistic>
<statistic horizontal text label="Downloads">5,693{lt}br{gt}billion</statistic><statistics horizontal>
<statistic label="Faves">49</statistic>
<statistic label="Views">78,435</statistic>
<statistic label="Members">3,858</statistic>
</statistics><statistics>
<statistic red label="Red">4</statistic>
<statistic orange label="Orange">8</statistic>
<statistic yellow label="Yellow">15</statistic>
<statistic olive label="Olive">16</statistic>
<statistic green label="Green">23</statistic>
<statistic teal label="Teal">42</statistic>
<statistic blue label="Blue">53</statistic>
<statistic violet label="Violet">68</statistic>
<statistic purple label="Purple">89</statistic>
<statistic grey label="Grey">131</statistic>
</statistics><segment inverted>
<statistics>
<statistic inverted red label="Red">4</statistic>
<statistic inverted orange label="Orange">8</statistic>
<statistic inverted yellow label="Yellow">15</statistic>
<statistic inverted olive label="Olive">16</statistic>
<statistic inverted green label="Green">23</statistic>
<statistic inverted teal label="Teal">42</statistic>
<statistic inverted blue label="Blue">53</statistic>
<statistic inverted violet label="Violet">68</statistic>
<statistic inverted purple label="Purple">89</statistic>
<statistic inverted grey label="Grey">131</statistic>
</statistics>
</segment><statistics four>
<statistic label="Saves">39</statistic>
<statistic label="Signups">525</statistic>
<statistic label="Flights" icon="plane">5</statistic>
<statistic label="Members" image="/avatars/1s.png">23</statistic>
</statistics>Lorem ipsum dolor sit amet, dolor maiorum ius ei, sea omnesque verterem ne. Facer decore theophrastus ne est, ea vim quot fierent eloquentiam, in reque porro mei. Ex legere laoreet scripserit ius, partem soluta timeam eu vim. Te mea congue aperiam, at mei diceret dolorum molestiae. Placerat complectitur vim ex.
Esse oportere temporibus at vix, has reque paulo appareat ad, an prima salutatus referrentur sea. Probo minimum eos ut, ea lobortis perpetua nec. Cum posse semper et. Graeci tamquam ut sit, an appareat adolescens eum. Novum elitr in quo, cum ea vocibus signiferumque. Solet antiopam mediocritatem ei per, an vim clita alterum verterem, utinam dignissim dissentiunt te quo.
Ex pri doctus offendit, sint error dignissim mel ea, ex sed eius graeco timeam. At eam impedit adipisci accusata, impedit accusam mel ex, eam docendi albucius an. Ius detraxit menandri cu. Per falli veniam mentitum an, alii ancillae et has. Eu his quod tollit, mazim quaeque habemus usu ea.
thousand
Lorem ipsum dolor sit amet, dolor maiorum ius ei, sea omnesque verterem ne. Facer decore theophrastus ne est, ea vim quot fierent eloquentiam, in reque porro mei. Ex legere laoreet scripserit ius, partem soluta timeam eu vim. Te mea congue aperiam, at mei diceret dolorum molestiae. Placerat complectitur vim ex.
Esse oportere temporibus at vix, has reque paulo appareat ad, an prima salutatus referrentur sea. Probo minimum eos ut, ea lobortis perpetua nec. Cum posse semper et. Graeci tamquam ut sit, an appareat adolescens eum. Novum elitr in quo, cum ea vocibus signiferumque. Solet antiopam mediocritatem ei per, an vim clita alterum verterem, utinam dignissim dissentiunt te quo.
<segment clearing>
<statistic left floated label="Shares">345</statistic>
<lorem 3 short>
<statistic right floated text label="Signups">Three{lt}br/{gt}thousand</statistic>
<lorem 2 short>
</segment><statistic mini label="Mini">2,304</statistic>
<statistic tiny label="Tiny">2,304</statistic>
<statistic small label="Small">2,304</statistic>
<statistic label="Medium">2,304</statistic>
<statistic large label="Large">2,304</statistic>
<statistic huge label="Huge">2,304</statistic>thousand
<statistics four stackable>
<statistic text label="Signups" amp-invisible>Three{lt}br/{gt}thousand</statistic>
<statistic label="Signups" amp-only>3k</statistic>
<statistic label="Team members" image="//placehold.co/512x512">11</statistic>
<statistic label="Releases">14</statistic>
<statistic label="Downloads" amp-invisible>65,500</statistic>
<statistic label="Downloads" amp-only>65k</statistic>
</statistics>