<div class="news-mini">
<div class="news-mini__cards-grid">
</div>
</div>
<div class="news-mini">
{% if fields.showTitle | default %}
<h2 class="news-mini__title"
id="{{ fields.title|sanitize }}">
{{ fields.title }}
</h2>
{% endif %}
<div class="news-mini__cards-grid">
{% for post in fields.items %}
<div class="news-mini__card">
{% include 'partials/news/news-card/news-card.twig' %}
</div>
{% endfor %}
</div>
{% if fields.showCTALink | default %}
<div class="news-mini__cta-container" data-cy="news-mini__cta-container"
{{ fields.showCTALink ? 'data-show-cta="true"' : 'data-show-cta="false"' }}>
{% include 'bits/standard-button/standard-button.twig' with {
button: {
text: fields.linkText,
url: fields.linkUrl
}
} %}
</div>
{% endif %}
</div>
{
"componentSpacing": "large",
"background": "light",
"component": {
"type": "news-mini",
"title": "The latest news about kittens",
"cards": [
{
"title": "Etiam fermentum nibh vitae viverra laoreet",
"permalink": "http://localhost:3000/components/detail/news",
"publishDate": "November 19, 2019",
"featuredImage": {
"src": "https://placekitten.com/320/228",
"altText": "friendly kitten"
}
},
{
"title": "Nulla ipsum libero, aliquam et dictum sed, porttitor eget lorem",
"permalink": "http://localhost:3000/components/detail/news",
"publishDate": "November 19, 2019",
"featuredImage": {
"src": "https://placekitten.com/320/228",
"altText": "friendly kitten"
}
},
{
"title": "Aliquam condimentum velit sed nisl euismod, sit amet interdum erat vestibulum",
"permalink": "http://localhost:3000/components/detail/news",
"publishDate": "November 19, 2019",
"featuredImage": {
"src": "https://placekitten.com/320/228",
"altText": "friendly kitten"
}
},
{
"title": "Integer eget suscipit erat",
"permalink": "http://localhost:3000/components/detail/news",
"publishDate": "November 19, 2019",
"featuredImage": {
"src": "https://placekitten.com/320/228",
"altText": "friendly kitten"
}
}
],
"callToAction": {
"text": "Read more news",
"url": "#"
}
}
}
.news-mini
@extends $componentWithMargin
&__title
@extends $headline1
color charcoalLight
margin-bottom 48px
&__cards-grid
margin-bottom 48px
No notes defined.