yaffs.net Git - yaffs-website/blob - web/core/modules/responsive_image/templates/responsive-image.html.twig

   1 {#
   2 /**
   3  * @file
   4  * Default theme implementation of a responsive image.
   5  *
   6  * Available variables:
   7  * - sources: The attributes of the <source> tags for this <picture> tag.
   8  * - img_element: The controlling image, with the fallback image in srcset.
   9  * - output_image_tag: Whether or not to output an <img> tag instead of a
  10  *   <picture> tag.
  11  *
  12  * @see template_preprocess()
  13  * @see template_preprocess_responsive_image()
  14  *
  15  * @ingroup themeable
  16  */
  17 #}
  18 {% if output_image_tag %}
  19   {{ img_element }}
  20 {% else %}
  21   <picture>
  22     {% if sources %}
  23       {#
  24       Internet Explorer 9 doesn't recognise source elements that are wrapped in
  25       picture tags. See http://scottjehl.github.io/picturefill/#ie9
  26       #}
  27       <!--[if IE 9]><video style="display: none;"><![endif]-->
  28       {% for source_attributes in sources %}
  29         <source{{ source_attributes }}/>
  30       {% endfor %}
  31       <!--[if IE 9]></video><![endif]-->
  32     {% endif %}
  33     {# The controlling image, with the fallback image in srcset. #}
  34     {{ img_element }}
  35   </picture>
  36 {% endif %}