Gallery

100%
<div class="grid-x grid-margin-x grid-padding-y small-up-2 medium-up-3 large-up-4">
    <div class="cell">
        <figure class="c-media">
            <div class="c-media__content">
                <picture class="c-media__picture">
                    <img class="c-media__image" src="../../../assets/img/landscape.jpg" alt="altText" title="Nulla vitae elit libero, a pharetra augue. Cras Etiam Commodo Lorem Ridiculus">
                </picture>
            </div>
        </figure>
    </div>
    <div class="cell">
        <figure class="c-media">
            <div class="c-media__content">
                <picture class="c-media__picture">
                    <img class="c-media__image" src="../../../assets/img/landscape.jpg" alt="altText" title="Nulla vitae elit libero, a pharetra augue. Cras Etiam Commodo Lorem Ridiculus">
                </picture>
            </div>
        </figure>
    </div>
    <div class="cell">
        <figure class="c-media">
            <div class="c-media__content">
                <picture class="c-media__picture">
                    <img class="c-media__image" src="../../../assets/img/landscape.jpg" alt="altText" title="Nulla vitae elit libero, a pharetra augue. Cras Etiam Commodo Lorem Ridiculus">
                </picture>
            </div>
        </figure>
    </div>
    <div class="cell">
        <figure class="c-media">
            <div class="c-media__content">
                <picture class="c-media__picture">
                    <img class="c-media__image" src="../../../assets/img/landscape.jpg" alt="altText" title="Nulla vitae elit libero, a pharetra augue. Cras Etiam Commodo Lorem Ridiculus">
                </picture>
            </div>
        </figure>
    </div>
</div>
<div class="grid-x grid-margin-x grid-padding-y small-up-2 medium-up-3 large-up-4">
    <div class="cell">
        {% render '@media' with { gallery: gallery, caption: false } %}
    </div>
    <div class="cell">
        {% render '@media' with { gallery: gallery, caption: false } %}
    </div>
    <div class="cell">
        {% render '@media' with { gallery: gallery, caption: false } %}
    </div>
    <div class="cell">
        {% render '@media' with { gallery: gallery, caption: false } %}
    </div>
</div>
{
  "additionalClasses": "",
  "group": "gallery-1"
}

There are no notes for this item.