Block Stats

{# derafu_twig:templates/pages/components/block-stats.html.twig #}

{% extends 'layouts/default.html.twig' %}

{% block content %}

<twig:block-stats
    class="my-4"
    :stats="[
        {
            value: '$40.000',
            text: 'Base price up to quota of 2.000 <a href=\'https://www.example.com/\' target=\'_blank\'>documents</a>'
        },
        {
            value: '$15',
            text: 'Price per extra document above quota'
        },
        {
            value: '24/7',
            text: 'Technical support available'
        },
        {
            value: '99.9%',
            text: 'Guaranteed uptime'
        }
    ]"
/>

<twig:block-stats
    class="my-4"
    :stats="[
        {
            value: '$40.000',
            text: 'Base price up to quota of 2.000 documents'
        },
        {
            value: '$15',
            text: 'Price per extra document above quota'
        },
        {
            value: '24/7',
            text: 'Technical support available'
        },
        {
            value: '99.9%',
            text: 'Guaranteed uptime'
        }
    ]"
    textPosition="top"
/>

<twig:block-stats
    class="my-4"
    :stats="[
        {
            value: '$40.000',
            text: 'Base price up to quota of 2.000 documents'
        },
        {
            value: '$15',
            text: 'Price per extra document above quota'
        },
        {
            value: '24/7',
            text: 'Technical support available'
        },
        {
            value: '99.9%',
            text: 'Guaranteed uptime'
        },
        {
            value: '99.9%',
            text: 'Guaranteed uptime'
        }
    ]"
/>

<twig:block-stats
    class="my-4"
    :stats="[
        {
            value: '1.000',
            text: 'Customers'
        },
        {
            value: '10',
            text: 'Years'
        },
        {
            value: '8/5',
            text: 'Technical support'
        },
        {
            value: '99.9%',
            text: 'Uptime'
        },
        {
            value: '5',
            text: 'Products'
        },
        {
            value: '3',
            text: 'Countries'
        }
    ]"
/>

{% endblock %}