fiu-8.x-2.1-alpha6/templates/fine-image-widget.html.twig

{#
/**
 * @file
 * Default theme implementation for an image field widget.
 *
 * Available variables:
 * - attributes: HTML attributes for the containing element.
 * - data: Render elements of the image widget.
 *
 * @see template_preprocess_fine_image_widget()
 *
 * @ingroup themeable
 */
#}
{% if info %}
  <div class="fiu-image-info" id="{{ data.id }}">
    <div class="fiu-full-image">
      <div class="inner-fiu-full-image">
        <img src="{{ info.url.value }}">
        <div class="fiu-img-description">
          <ul>
            {% for row in info|without('url') %}
              {% if row %}
                <li>
                  <b>{{ row.title }} :</b>
                  {{ row.value }}
                </li>
              {% endif %}
            {% endfor %}
          </ul>
          <div class="attr">
            {% if data.alt %}
              {{ data.alt }}
            {% endif %}

            {% if data.title %}
              {{ data.title }}
            {% endif %}
          </div>
        </div>
      </div>
    </div>
  </div>
{% endif %}

<div{{ attributes }}>
  {% if data.preview %}
    <div class="fine-image-preview">
      {{ data.preview }}
    </div>
  {% endif %}

  {% if file_name %}
    <div class="fine-image-file-name">
      <span>{{ file_name }}</span>
    </div>
  {% endif %}

  {# Render widget data without the image preview that was output already. #}
  <div class="fine-image-data">
    {% if details %}
      <span class="fiu-image-details" data-fiu-id="{{ data.id }}">
        {{ details }}
      </span>
    {% endif %}

    {{ data|without('preview', 'title', 'alt', 'id') }}
  </div>
</div>