<!-- Expressive Image Card -->
<div class="card card_expressive_image card_type_default theme_">
<div class="card_inner card_expressive_image_inner">
<div class="card_expressive_image_grid">
<div class="card_expressive_image_media">
<figure class="card_expressive_image_figure">
<img class="card_expressive_image_image" srcset="https://images.fastspot.com/jhusoe/735x980/1 735w, https://images.fastspot.com/jhusoe/555x740/1 555w, https://images.fastspot.com/jhusoe/375x500/1 375w, https://images.fastspot.com/jhusoe/225x300/1 225w" sizes="(min-width: 1394px) 404px, (min-width: 1220px) 252px, (min-width: 980px) 282px, (min-width: 740px) 212px, 90vw" src="https://images.fastspot.com/jhusoe/225x300/1" alt="" loading="lazy" width="225" height="300">
</figure>
<div class="card_expressive_image_body">
<p class="card_expressive_image_caption"></p>
</div>
</div>
</div>
</div>
</div>
<!-- END: Topic Card -->
{#
{% include '@partial-expressive-image-card' with {
item: {
type: 'default',
image: '1',
alt: 'alt',
title: 'Title',
description: 'Description',
link: {
url: '#',
label: 'Link Label'
}
}
} %}
#}
<!-- Expressive Image Card -->
<div class="card card_expressive_image card_type_{{ item.type ?: 'default' }} theme_{{ item.theme ?: '' }}">
<div class="card_inner card_expressive_image_inner">
<div class="card_expressive_image_grid">
<div class="card_expressive_image_media">
<figure class="card_expressive_image_figure">
{% include '@partial-image' with {
class: 'card_expressive_image',
alt: item.alt,
image: item.image,
loading: 'lazy',
sources: [
img.portraitFull.med,
img.portraitFull.sml,
img.portraitFull.xsml,
img.portraitFull.xxsml
],
sizes: [
'(min-width: 1394px) 404px',
'(min-width: 1220px) 252px',
'(min-width: 980px) 282px',
'(min-width: 740px) 212px',
'90vw'
]
} %}
</figure>
<div class="card_expressive_image_body">
<p class="card_expressive_image_caption">{{ item.caption }}</p>
</div>
</div>
</div>
</div>
</div>
<!-- END: Topic Card -->
No notes defined.