--- /dev/null
+{#
+/**
+ * @file
+ * Default theme implementation for the Slick carousel template.
+ *
+ * This template holds 3 displays: main, thumbnail and overlay slicks in one.
+ * Arrows are enforced, but toggled by JS accordingly. This allows responsive
+ * object to enable and disable it as needed without losing context.
+ *
+ * Available variables:
+ * - items: The array of items containing main image/video/audio, optional
+ * image/video/audio overlay and captions, and optional thumbnail
+ * texts/images.
+ * - settings: A cherry-picked settings that mostly defines the slide HTML or
+ * layout, and none of JS settings/options which are defined at data-slick.
+ * - attributes: The array of attributes to hold the main container classes, id.
+ * - content_attributes: The array of attributes to hold optional RTL, id and
+ * data-slick containing JSON object aka JS settings the Slick expects to
+ * override default options. We don't store these JS settings in the normal
+ * <head>, but inline within data-slick attribute instead.
+ *
+ * Debug:
+ * @see https://www.drupal.org/node/1906780
+ * @see https://www.drupal.org/node/1903374
+ * Use Kint: {{ kint(variable) }}
+ * Dump all available variables and their contents: {{ dump() }}
+ * Dump only the available variable keys: {{ dump(_context|keys) }}
+ */
+#}
+{%
+ set classes = [
+ 'slick',
+ settings.unslick ? 'unslick',
+ display == 'main' and settings.blazy ? 'blazy',
+ settings.vertical ? 'slick--vertical',
+ settings.attributes.class ? settings.attributes.class|join(' '),
+ settings.skin ? 'slick--skin--' ~ settings.skin|clean_class,
+ 'boxed' in settings.skin ? 'slick--skin--boxed',
+ 'split' in settings.skin ? 'slick--skin--split',
+ settings.optionset ? 'slick--optionset--' ~ settings.optionset|clean_class,
+ arrow_down_attributes is defined ? 'slick--has-arrow-down',
+ settings.asNavFor ? 'slick--' ~ display|clean_class,
+ settings.slidesToShow > 1 ? 'slick--multiple-view',
+ settings.count <= settings.slidesToShow ? 'slick--less',
+ display == 'main' and settings.media_switch ? 'slick--' ~ settings.media_switch|clean_class,
+ display == 'thumbnail' and settings.thumbnail_caption ? 'slick--has-caption'
+ ]
+%}
+{%
+ set arrow_classes = [
+ 'slick__arrow',
+ settings.vertical ? 'slick__arrow--v',
+ settings.skin_arrows ? 'slick__arrow--' ~ settings.skin_arrows|clean_class
+ ]
+%}
+
+<div{{ attributes.addClass(classes) }}>
+ {% if not settings.unslick %}
+ <div{{ content_attributes.addClass('slick__slider') }}>
+ {% endif %}
+
+ {% block slick_content %}
+ {% for item in items %}
+ {{ item }}
+ {% endfor %}
+ {% endblock %}
+
+ {% if not settings.unslick %}
+ </div>
+ {% block slick_arrow %}
+ <nav{{ arrow_attributes.addClass(arrow_classes) }}>
+ {{ settings.prevArrow|striptags('<a><em><span><strong><button><div>')|raw }}
+ {% if arrow_down_attributes is defined %}
+ <button{{ arrow_down_attributes.addClass('slick-down')
+ .setAttribute('type', 'button')
+ .setAttribute('data-target', settings.downArrowTarget)
+ .setAttribute('data-offset', settings.downArrowOffset) }}></button>
+ {% endif %}
+ {{ settings.nextArrow|striptags('<a><em><span><strong><button><div>')|raw }}
+ </nav>
+ {% endblock %}
+ {% endif %}
+</div>
projects / yaffs-website / blobdiff