ws_small_y-1.0.x-dev/modules/ws_small_y_statistics/templates/block--small-y-statistics.html.twig

{#
/**
 * @file
 * Theme override to display a block.
 *
 * Available variables:
 * - plugin_id: The ID of the block implementation.
 * - label: The configured label of the block if visible.
 * - configuration: A list of the block's configuration values.
 *   - label: The configured label for the block.
 *   - label_display: The display settings for the label.
 *   - provider: The module or other provider that provided this block plugin.
 *   - Block plugin specific settings will also be stored here.
 * - content: The content of this block.
 * - attributes: array of HTML attributes populated by modules, intended to
 *   be added to the main container tag of this template.
 *   - id: A valid HTML ID and guaranteed unique.
 * - title_attributes: Same as attributes, except applied to the main title
 *   tag that appears in the template.
 * - title_prefix: Additional output populated by modules, intended to be
 *   displayed in front of the main title tag that appears in the template.
 * - title_suffix: Additional output populated by modules, intended to be
 *   displayed after the main title tag that appears in the template.
 *
 * @see template_preprocess_block()
 */
#}
{%
  set classes = [
  'container-fluid',
  'block',
  'block-' ~ configuration.provider|clean_class,
  'block-' ~ plugin_id|clean_class,
  'small-y-statistics-block',
  style
]
%}

{{ attach_library('ws_small_y_statistics/small_y_statistics') }}
{% set statistic_id = 'lb-statistics-' ~ configuration['block_revision_id'] %}

<div{{ attributes.addClass(classes).setAttribute('id', plugin_id|clean_class ~ configuration['block_revision_id']) }}>
  {{ title_prefix }}
  {{ title_suffix }}
  {% block content %}
        {% if block_content.field_section_title or block_content.field_body %}
          <div class="statistics-header">
            <div class="container">
              <div class="statistics-header--wrapper">
                {% if block_content.field_section_title %}
                  <h2 class="statistics-header--title">{{ block_content.field_section_title.value }}</h2>
                {% endif %}
                {% if block_content.field_body %}
                  <p class="statistics-header--description">{{ block_content.field_body.value }}</p>
                {% endif %}
              </div>
            </div>
          </div>
        {% endif %}
        <div class="statistics-content container">
          <div class="statistics-content--wrapper stats row" id="{{ statistic_id }}">
            {% if items %}
              {% for key, item in items %}
                {% set safe_hash = configuration['block_revision_id'] ~ '--' ~ loop.index %}
                {% set pp_attr = create_attribute() %}
                {%
                  set pp_classes = [
                  'statistics-content-item',
                  'col-12',
                  'col-lg-6',
                ]
                %}

                <div{{ pp_attr.addClass(pp_classes) }}>
                    <div class="inner">
                      {% if item.number %}
                        <div class="g-0 h2 statistics-content-item--count">
                          {# Optionally add: data-duration="" to change the count speed from the default 3000ms. #}
                          {{ item.prefix }}<span class="js-count" data-count="{{ item.number }}">0</span>{{ item.suffix }}
                        </div>
                      {% endif %}
                      <div class="statistics-content-item--wrapper">
                      {% if item.title %}
                        <p class="statistics-content-item--title">{{ item.title }}</p>
                      {% endif %}
                      {% if item.description %}
                        <p class="statistics-content-item--description">{{ item.description|raw }}</p>
                      {% endif %}
                    </div>
                  </div>
                </div>
              {% endfor %}
            {% endif %}
        </div>
    </div>
  {% endblock %}
</div>