No notes defined.
<figure class='c-stat c-stat--progress-bar c-stat--inline c-stat--success '>
<span class='c-stat__text'>
<figcaption class='c-stat__caption'>
<strong class='c-stat__highlight'>Focus on Impact</strong>
</figcaption>
<span class='c-stat__figure'><span class='c-stat__number'>91%</span> <span class='c-stat__progress-bar' style='width: 91%;'></span></span>
<span class='c-stat__detail'>of participants in 2019 aim at helping as many individuals as possible, even if it costs them time and energy.</span>
</span>
</figure>
<figure class='{{ get_component_class( 'stat', display ) }} {% if icon %} c-stat--with-icon {% endif %}'>
{% if icon %}
{% include '@unit/icon/icon.twig' with icon|merge( { display: { component: 'stat', modifiers: [ 'double' ] } } ) %}
{% endif %}
<span class='c-stat__text'>
{% if detail %}
<figcaption class='c-stat__caption'>
<strong class='c-stat__highlight'>{{ caption | raw }}</strong>
</figcaption>
{% endif %}
<span class='c-stat__figure' {% if floating %} style='padding-left: {{ figure }}%;'{% endif %}><span class='c-stat__number'>{{ figure }}{{ suffix }}</span> {% if suffix == "%" %} <span class='c-stat__progress-bar' style='width: {{ figure }}%;'></span>{% endif %}</span>
{% if not detail %}
<figcaption class='c-stat__caption'>
<strong class='c-stat__highlight'>{{ caption | raw }}</strong>
</figcaption>
{% else %}
{% if detail %}
<span class='c-stat__detail'>{{ detail | raw }}</span>
{% endif %}
{% endif %}
</span>
</figure>
{
"figure": 91,
"suffix": "%",
"caption": "Focus on Impact",
"detail": "of participants in 2019 aim at helping as many individuals as possible, even if it costs them time and energy.",
"display": {
"modifiers": [
"progress-bar",
"inline",
"success"
]
}
}