featured-media.html.twig

{% apply spaceless %}

{# Parameters:
  - title (string) (default: '')
  - title_tag (string) (default: 'h2')
  - title_link: (link object) (default: {})
  - title_attributes: (drupal attrs)
  - with_text (boolean) (default: false)
  - alignment: (string) (default: 'right')
    - options ['left', 'right']
  - image: (string) (default: '')
  - poster_image: (string) (default: '')
  - content: (string) (default: '')
  - wrapper_classes: (default: '')
  - content_classes: (string) (default: '')
  - read_more (object) (default: {})
  - description (string) (default: '')
  - ratio: (string) (default: '16x9')
    - options ['1x1', '4x3', '16x9', '21x9']
  - sources: (object[]) (default: []) format: [
    {
      type: '',
      src: ''
    }
  ]
  - tracks: (object[]) (default: []) format: [
    {
      kind: '',
      label: '',
      src: '',
      src_lang: ''
    }
  ]

  Blocks:
    - "embedded_media"
#}

{% set _title = title|default('') %}
{% set _title_tag = title_tag|default('h2') %}
{% set _title_link = title_link|default({}) %}
{% set _title_attributes = title_attributes ?: create_attribute() %}
{% set _with_text = with_text ?? false %}
{% set _alignment = alignment|default('right') %}
{% set _image = image|default('') %}
{% set _poster_image = poster_image|default('') %}
{% set _content = content|default('') %}
{% set _wrapper_classes = wrapper_classes|default('') %}
{% set _content_classes = content_classes|default('') %}
{% set _read_more = read_more|default({}) %}
{% set _description = description|default('') %}
{% set _ratio = ratio|default('16x9') %}
{% set _sources = sources|default([]) %}
{% set _tracks = tracks|default([]) %}
{% set _embedded_media = embedded_media|default('') %}

{% set _classes = 'bcl-featured-item' %}
{% set _col_classes = 'col-12 col-md-6' %}

{% if _wrapper_classes is not empty %}
  {% set _classes = _classes ~ ' ' ~ wrapper_classes %}
{% endif %}

{% if attributes is empty %}
  {% set attributes = create_attribute() %}
{% endif %}

{% if _with_text %}
  {% set _title_attributes = _title_attributes.addClass(['fw-bold', 'mb-4']) %}
{% endif %}

{% set attributes = attributes.addClass(["rounded", "overflow-hidden"]) %}

{% if _image is not empty %}
  {% set attributes = attributes.addClass(["d-inline-flex", "flex-wrap"]) %}
  {% if _content_classes is not empty %}
    {% set _content_classes = _content_classes ~ ' flex-1 w-min-content' %}
  {% else %}
    {% set _content_classes = 'flex-1 w-min-content' %}
  {% endif %}
{% endif %}

{% if _with_text %}
<div class="{{ _classes }}">
  <div class="row">
{% endif %}

{%- if _title is not empty -%}
  {% include '@oe-bcl/bcl-heading/heading.html.twig' with {
    title: _title,
    title_tag: _title_tag,
    title_link: _title_link,
    attributes: _title_attributes,
  } only %}
{%- endif -%}

{% if _with_text %}
  <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '1' : '2' }}">
    {{- _description|default('') -}}

    {% if _read_more is not empty %}
      {% include '@oe-bcl/bcl-link/link.html.twig' with _read_more only %}
    {% endif %}
  </div>
  <div class="{{ _col_classes }} order-{{ _alignment == "right" ? '2 mt-4 mt-md-0' : '1' }}">
{% endif %}

<figure
  {{ attributes }}
>
{% if _embedded_media is not empty %}
  {% set _video_classes = "ratio ratio-" ~ _ratio %}
  <div class="{{ _video_classes }}">
    {%- block embedded_media _embedded_media -%}
  </div>
{% elseif _sources is not empty and _sources is iterable %}
  <video
    controls
    poster="{{ _poster_image }}"
    class="w-100 d-block"
  >
  {% for source in _sources %}
  <source type="{{ source.type }}" src="{{ source.src }}" />
  {% endfor %}
  {% if _tracks is not empty and _tracks is iterable %}
    {% for track in _tracks %}
    <track
      kind="{{ track.kind }}"
      label="{{ track.label }}"
      src="{{ track.src }}"
      srclang="{{ track.src_lang }}"
    />
    {% endfor %}
  {% endif %}
  </video>
{% else %}
  {{ _image }}
{% endif %}

{% if _content is not empty %}
  <figcaption
    {% if _content_classes is not empty %}
    class="{{ _content_classes }}"
    {% endif %}
  >
    {{- _content -}}
  </figcaption>
{% endif %}
</figure>

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

{% endapply %}