Section Grid
The Section Grid is made up of the following components:
Stories
Lorem Ipsum Dolor Ame Mauris Magna Elit, Moestie at Temport.
<section class="section-grid">
{%
include "@h4h_theme/section-title/section-title.twig" with {
title: section.title,
desc: section.desc,
heading_level: section.heading_level
} only
%}
<div class="l-grid l-grid--space-between">
{% for item in items %}
{# The first and every 4th item need to expand the full width of the grid. #}
{% if (loop.index - 1) is divisibleby(3) %}
{%
set gridClass = ' l-grid__col'
%}
{% else %}
{%
set gridClass = ' l-grid__col l-grid__col-half'
%}
{% endif %}
{%
include "@h4h_theme/teaser/teaser.twig" with {
title: item.title,
desc: item.desc,
heading_level: item.heading_level,
url: item.url,
img: item.img,
btn_text: item.btn_text,
modifier_class: item.modifier_class ~ gridClass
} only
%}
{% endfor %}
</div>
<ul class="js-pager__items pager--container pager--load-more">
<li class="pager__item">
<a href="#" rel="next" class="btn btn--secondary btn--large">See More Stories</a>
</li>
</ul>
</section>