mason-8.x-1.x-dev/templates/mason-box.html.twig

{#
/**
 * @file
 * Default theme implementation for the individual Mason box/item template.
 *
 * Available variables:
 * - attributes: An array of attributes to apply to the element.
 * - item.box: A renderable array of the main image/background, or empty if
 *   CSS background image is preferred.
 * - item.caption: A renderable array containing caption fields if provided:
 *   - title: The individual box title.
 *   - link: The box links or buttons.
 *   - data: any possible field for more complex data if crazy enough.
 * - settings: An array containing the given settings.
 *
 * @see template_preprocess_mason_box()
 */
#}
{%
  set classes = [
    'box--' ~ delta,
    settings.layout ? 'box--caption--' ~ settings.layout|clean_class,
    settings.background ? 'box--background',
    settings.class ? settings.class|clean_class,
  ]
%}
{%
  set content_classes = [
    'box__content'
  ]
%}
{% set use_blazy = blazies.use.theme_blazy  %}
<div{{ attributes.addClass(classes) }}>

  {%- if use_blazy -%}
    {{- item -}}
  {% else %}
    {# @todo remove all below at 3.x for theme_blazy(). If you need to modify
    anything, please use MYTHEME_preprocess_blazy() instead, starting at 3.x,
    or better just use CSS for more reliable theming. FYI, theme_blazy()
    offers greater possibility and versatility, that is why it is
    deprecated. #}
    <div{{ content_attributes.addClass(content_classes) }}>
      {{ item.box }}

      {% if item.caption %}
        <div class="box__caption">

          {% if item.caption.title %}
            <h2 class="box__title">{{ item.caption.title }}</h2>
          {% endif %}

          {% if item.caption.data or item.caption.alt %}
            <div class="box__description">
              {{ item.caption.data }}
              {{ item.caption.alt }}
            </div>
          {% endif %}

          {% if item.caption.link %}
            <div class="box__link">{{ item.caption.link }}</div>
          {% endif %}

          {% if item.caption.category %}
            <div class="box__category">{{ item.caption.category }}</div>
          {% endif %}

          {% if item.caption.overlay %}
            <div class="box__overlay">{{ item.caption.overlay }}</div>
          {% endif %}

        </div>
      {% endif %}
    </div>
  {% endif %}
</div>