Citizen University Component Library

Image 

<span class="lazy_image_wrapper media_image_wrapper">
    <img class="js-lazy js-lazyload media_image" data-sizes="auto" src="//images.fastspot.com/citizen-university/300x169/1" data-src="//images.fastspot.com/citizen-university/980x552/1" data-srcset="//images.fastspot.com/citizen-university/980x552/1 980w, //images.fastspot.com/citizen-university/740x416/1 740w, //images.fastspot.com/citizen-university/500x282/1 500w, //images.fastspot.com/citizen-university/300x169/1 300w" alt="">
</span>
<noscript>
    <img class="media_image" src="https://images.fastspot.com/citizen-university/300x169/1" srcset="https://images.fastspot.com/citizen-university/300x169/1 300w, https://images.fastspot.com/citizen-university/500x282/1 500w, https://images.fastspot.com/citizen-university/740x416/1 740w, https://images.fastspot.com/citizen-university/980x552/1 980w" sizes="100vw" alt="">
</noscript>
 
<span class="lazy_image_wrapper {{ class }}_image_wrapper">
	<img class="js-lazy js-lazyload {{ class }}_image"{% if sources|length > 1 %} data-sizes="auto"{% endif %} src="{% for source in sources|reverse %}{% if loop.first %}//images.fastspot.com/{{ config.images }}/{{ source.width }}x{{ source.height }}/{{ image }}{% endif %}{% endfor %}" data-src="//images.fastspot.com/{{ config.images }}/{{ sources|last.width }}x{{ sources|last.height }}/{{ image }}"{% if sources|length > 1 %} data-srcset="{% for source in sources|reverse %}//images.fastspot.com/{{ config.images }}/{{ source.width }}x{{ source.height }}/{{ image }} {{ source.width }}w{% if not loop.last %}, {% endif %}{% endfor %}"{% endif %} alt="{{ alt }}">
</span>
<noscript>
	<img class="{{ class }}_image" src="https://images.fastspot.com/{{ config.images }}/{{ sources|last.width }}x{{ sources|last.height }}/{{ image }}" {% if sources|length > 1 %} srcset="{% for source in sources|reverse %}https://images.fastspot.com/{{ config.images }}/{{ source.width }}x{{ source.height }}/{{ image }} {{ source.width }}w{% if not loop.last %}, {% endif %}{% endfor %}" sizes="100vw" {% endif %} alt="{{ alt }}">
</noscript>

No notes defined.