<div class="image-block image-block--contained">
<div class="image-block-inner">
<picture class="image">
<div class="image-inner">
<span style="padding-bottom: 55.55555555555556%;" class="image-placeholder"></span>
<img src="/temp/hero-example.jpg" alt="">
</div>
<figcaption class="image-caption">This is an image caption</figcaption>
</picture>
</div>
</div>
<div class="image-block{% if imageBlockModifiers is defined and imageBlockModifiers|length %} image-block--{{ imageBlockModifiers|join(' image-block--') }}{% endif %}">
<div class="image-block-inner">
{% include '@image' with image only %}
</div>
</div>
{
"image": {
"url": "/temp/hero-example.jpg",
"width": 1440,
"height": 800,
"alt": "",
"contain": false,
"transparent": false,
"caption": "This is an image caption"
},
"imageBlockModifiers": [
"contained"
]
}
Used for containing the @image-block and aligning it with a regular @text-block in an article context.