Variable Content Carousel Item
The Variable Content Carousel Item is displayed within
a Variable Content Carousel Container.
Goizueta Impact Investing Club
Some Text Eyebrow
Sub Head
- Markup Details
-
{{ attach_library('goizueta_theme/variable-content-carousel-item') }} {# Preserve the Drupal attributes if they're available. #} {% set component_classes = 'variable-content-carousel-item' %} {% set attributes = attributes ? attributes.addClass(component_classes) : ' class="' ~ component_classes ~ '"' %} {% import '@components/icons/icons.twig' as icons %} <article {{ attributes|raw }}> {% if variable_content_carousel_item.heading %} <div class="variable-content-carousel-item__title"> {% include '@components/heading/heading.twig' with { "heading" : variable_content_carousel_item.heading } only %} </div> {% endif %} {% if variable_content_carousel_item.image %} <div class="variable-content-carousel-item__image"> {{ variable_content_carousel_item.image }} </div> {% elseif variable_content_carousel_item.video %} <div class="variable-content-carousel-item__image"> <a href="{{ variable_content_carousel_item.video.url }}" class="variable-content-carousel-item__video-link" data-lity aria-label="Link to open video"> {{ variable_content_carousel_item.video.poster }} <span class="variable-content-carousel-item__icon-wrapper"> {{ icons.get('play', 'spotlight__play-icon') }} </span> </a> </div> {% endif %} <div class="variable-content-carousel-item__text"> {% if variable_content_carousel_item.eyebrow %} <div class="eyebrow"> {{ variable_content_carousel_item.eyebrow }} </div> {% endif %} {% if variable_content_carousel_item.sub_heading %} {% include '@components/heading/heading.twig' with { "heading" : variable_content_carousel_item.sub_heading } only %} {% endif %} {% if variable_content_carousel_item.text %} {{ variable_content_carousel_item.text }} {% endif %} </div> {% if variable_content_carousel_item.button %} <div class="variable-content-carousel-item__button"> {% include '@components/button/button.twig' with { "button": { "text": variable_content_carousel_item.button.text, "url": variable_content_carousel_item.button.url, "icon": variable_content_carousel_item.button.icon, } } only %} </div> {% endif %} </article>