slick_browser-8.x-2.1/templates/slick-browser.html.twig

{#
/**
 * @file
 * Default theme implementation for the slick-browser wrapper template.
 *
 * Available variables:
 * - attributes: An array of attributes to apply to the element.
 * - content: A renderable array of the preview elements.
 * - element: A renderable array of the form elements.
 * - settings: An array containing the given settings.
 *
 * @see template_preprocess_slick_browser()
 *
 */
#}
{%
  set classes = [
    'slick-browser',
    'blazy',
    'sb',
    'sb--widget',
    'is-sb-selection',
    not content.main ? 'is-sb-empty',
    blazies.is.unslick ? 'is-sb-unslick',
    sb.is.eb ? 'is-sb-eb',
    sb.is.text ? 'is-sb-text',
    settings.style ? 'is-sb-' ~ settings.style,
    settings.style == 'slick' and 'grid' in settings.skin ? 'is-sb-grid',
    blazies.target_type ? 'is-sb-' ~ blazies.target_type|clean_class,
    'is-sb-' ~ blazies.count,
  ]
%}
<div id="{{ attributes.id|clean_id }}"{{ attributes.addClass(classes)|without('id') }}>

  {% block slick_browser_header %}
    {% if content.header %}
      <div class="sb__header">
        <div class="button-group button-group--text">
          {{ content.header }}
        </div>
      </div>
    {% endif %}
  {% endblock %}

  {% block slick_browser_draggable %}
    {{ content.draggable }}
  {% endblock %}

  {% if content.main %}
    {% block slick_browser_preview %}
      <div class="sb__display">
        {{ content.main }}
      </div>
    {% endblock %}
  {% endif %}

  <div class="sb__zoom"></div>
</div>