wickywills
8/16/2017 - 9:06 AM

Split content over two columns

Split content over two columns

{% set itemsArrLength = items|length %}
{% set itemsArrLengthHalf = itemsArrLength / 2 %}
{% set itemsIndexVal = 0 %}

<div class="l-grid">
    <div class="l-grid__item teen--one-half">
    {% for key,item in items %}
        
            {% if itemsIndexVal == itemsArrLengthHalf|round(0, 'ceil') %}
                </div>
                <div class="l-grid__item teen--one-half">
            {% endif %}

            <div class="c-info-expander">
                <a name="e{{ key }}"></a>
                <a class="c-info-expander__top-link" href="#top">Return to top</a>
                <input type="checkbox" class="c-info-expander__toggle" id="c-info-expander__toggle-{{ key }}">
                <label class="c-info-expander__title" for="c-info-expander__toggle-{{ key }}">{{ item.title }}</label>
                <div class="c-info-expander__content c-std">

                    {% if item.image is defined and item.image is not empty %}
                        <div class="c-info-expander__image-content">
                            <div class="c-info-expander__image-content__image">
                                <img src="{{ item.image }}">
                            </div>
                            <div class="c-info-expander__image-content__content">{{ item.content|raw }}</div>
                        </div>
                    {% else %}
                        {{ item.content|raw }}
                    {% endif %}
                </div>
            </div>

            {% set itemsIndexVal = itemsIndexVal + 1 %}
        
    {% endfor %}
    </div>
</div>