24 lines
924 B
HTML
24 lines
924 B
HTML
|
{% comment %}
|
||
|
|
Imágenes responsive. Esto logra que solo se carguen las versiones de
|
||
|
|
las imágenes con el ancho máximo de la pantalla.
|
||
|
|
|
||
|
|
TODO: Las imágenes en md y superior nunca llegan al ancho máximo así
|
||
|
|
que tienen una resolución de más.
|
||
|
|
{% endcomment %}
|
||
|
|
{%- assign image = include.image.path | default: 'public/placeholder.png' %}
|
||
|
|
{%- assign height = include.height | default: site.i18n.post.height -%}
|
||
|
|
{%- assign width = include.width | default: '100' -%}
|
||
|
|
|
||
|
|
<picture>
|
||
|
|
{% for size in site.images.sizes %}
|
||
|
|
<source srcset="{{ image | thumbnail: size }}" media="(max-width: {{ size }}px)" />
|
||
|
|
{% endfor %}
|
||
|
|
|
||
|
|
<img
|
||
|
|
class="u-photo w-{{ width }} {{ include.cover | equals: false | value_unless: 'fit-cover' }} h-{{ height }} {{ include.extra }}"
|
||
|
|
loading="lazy"
|
||
|
|
itemprop="image"
|
||
|
|
src="{{ image | thumbnail: 1140 }}"
|
||
|
|
alt="{{ include.image.description | include.default_description }}" />
|
||
|
|
</picture>
|