59 lines
2.2 KiB
Twig
59 lines
2.2 KiB
Twig
{#
|
|
/**
|
|
* @file
|
|
* Default theme implementation to display a Bootstrap Carousel component.
|
|
*
|
|
* Available variables:
|
|
* - attributes: An array of HTML attributes intended to be added to the main
|
|
* container tag of this template.
|
|
* - id: A valid HTML ID and guaranteed to be unique.
|
|
* - controls: Flag indicating whether or not to show the carousel controls.
|
|
* - indicators: Flag indicating whether or not to show the carousel indicators.
|
|
* - interval: The amount of time to delay between automatically cycling a
|
|
* slide item. If false, carousel will not automatically cycle.
|
|
* - pause: (optional) Pauses the cycling of the carousel on mouseenter and
|
|
* resumes the cycling of the carousel on mouseleave.
|
|
* - slides: A list of carousel slide items containing:
|
|
* - image: (required) The image to display in the slide item.
|
|
* - attributes: (optional) An array of HTML attributes intended to be added
|
|
* to the slide item.
|
|
* - title: (optional) A title to display for the slide item.
|
|
* - description: (optional) Additional helpful text to display for a slide
|
|
* item.
|
|
* - start_index: (optional) Alters the slide position relative to its current
|
|
* position.
|
|
* - wrap: (optional) Whether the carousel should cycle continuously or have
|
|
* hard stops.
|
|
*
|
|
* @ingroup templates
|
|
*/
|
|
#}
|
|
{% set classes = ['carousel', 'slide'] %}
|
|
<div{{ attributes.addClass(classes) }} data-ride="carousel" data-interval="{{ interval }}" data-pause="{{ pause }}" data-wrap="{{ wrap }}">
|
|
{% if indicators %}
|
|
{{ indicators }}
|
|
{% endif %}
|
|
<div class="carousel-inner" role="listbox">
|
|
{% for slide in slides %}
|
|
{% set slide_classes = ['item', start_index == loop.index0 ? 'active'] %}
|
|
<div{{ slide.attributes.addClass(slide_classes) }}>
|
|
{{ slide.image }}
|
|
{% if slide.title or slide.description %}
|
|
<div class="carousel-caption">
|
|
{% if slide.title %}
|
|
<h3>{{ slide.title }}</h3>
|
|
{% endif %}
|
|
{% if slide.description %}
|
|
<p>{{ slide.description }}</p>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% if controls %}
|
|
{{ controls.left }}
|
|
{{ controls.right }}
|
|
{% endif %}
|
|
</div>
|