Stats Breaker

The Stats Breaker component is a set of cards with different content. They sit above a screen-wide background image with various overlays. One fo the cards can potentially hold a chart.

bg image
  • Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla. Etiam porta sem malesuada magna mollis euismod.
  • card image
Markup Details
                            {{ attach_library('goizueta_theme/stats-breaker') }}

<section class="stats-breaker">
  {% if background_image %}
    <div class="stats-breaker__bg-image">
      {{ background_image }}
    </div>
  {% endif %}
  <div class="stats-breaker__cards-wrapper">
    <ul class="stats-breaker__items">
      {% block card_item %}
      {% for item in items %}
        <li class="stats-breaker__item">
          {%
            include '@components/content-card/content-card.twig' with {
              "content_card": item.content_card
            } only
          %}
        </li>
      {% endfor %}
      {% endblock %}
    </ul>
  </div>
</section>