<aside class="Promo flow">
<div class="body flow">
<h2>Heading</h2>
<p>Vestibulum id ligula porta felis euismod semper. Cras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Donec sed odio dui. Nullam id dolor id nibh ultricies vehicula ut id elit. Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p>Maecenas faucibus mollis interdum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam quis risus eget urna mollis ornare vel eu leo. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur.</p>
</div>
<a class="combo-button focus" href="#">
<span class="">Find out more</span>
<div>
<svg role="img" aria-hidden="true" focusable="false" class="Icon Icon--arrow-right Icon--s">
<use xlink:href="/v6-assets/img/icons/sprite.svg?cachebust=2#arrow-right"></use>
</svg>
</div>
</a>
</aside>
<aside class="Promo flow">
<div class="body flow">
{{ content|raw }}
</div>
{% if link is defined and link %}
{% include '@combo-button' with {
text: linkLabel ?? 'Find out more',
link: link
} %}
{% endif %}
</aside>
{
"content": "<h2>Heading</h2><p>Vestibulum id ligula porta felis euismod semper. Cras mattis consectetur purus sit amet fermentum. Donec sed odio dui. Donec sed odio dui. Nullam id dolor id nibh ultricies vehicula ut id elit. Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p><p>Maecenas faucibus mollis interdum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam quis risus eget urna mollis ornare vel eu leo. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur.</p>",
"link": "#",
"linkLabel": "Find out more"
}
.Promo {
background: var(--light-grey-step-1);
padding: var(--space-s-m);
}
No notes defined.