DIA Frontend

Images 

<!-- ### Begin: Element image ### -->
    <div id="c129" class="frame frame-default frame-type-image frame-layout-0 frame-background-none frame-no-backgroundimage frame-space-before-none frame-space-after-none">
        <div class="frame-container">
            <div class="frame-inner">

                <header class="frame-header">
                    <h2 class="element-header">
                        6 Images in 3 Columns
                    </h2>
                </header>

                <div class="gallery-row">
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="From above, by adrian" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/VKgBktwrtX0
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Cheers For The Years, by Felix Russell-Saw" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/XyoW1MhPqbs
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Photo by Geran de Klerk" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/WJkc3xZjSXw
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Bird eye’s view!, by Kimon Maritz" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/1-ISIwuBMiw
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Photo by Nikita Maru" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/search/street-above?photo=2fZQFQ4FOPU
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-3">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Big Sur Road Trip, by Richard Nolan" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/jQ_RRJgun3s
                            </figcaption>
                        </figure>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ### End: Element image ### -->

    <!-- ### Begin: Element image ### -->
    <div id="c560" class="frame frame-default frame-type-image frame-layout-0 frame-background-none frame-no-backgroundimage frame-space-before-none frame-space-after-none">
        <div class="frame-container">
            <div class="frame-inner">

                <header class="frame-header">
                    <h2 class="element-header">
                        4 images in 2 columns
                    </h2>
                </header>

                <div class="gallery-row">
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="From above, by adrian" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/VKgBktwrtX0
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Cheers For The Years, by Felix Russell-Saw" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/XyoW1MhPqbs
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Photo by Geran de Klerk" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/WJkc3xZjSXw
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Bird eye’s view!, by Kimon Maritz" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/1-ISIwuBMiw
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Photo by Nikita Maru" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/search/street-above?photo=2fZQFQ4FOPU
                            </figcaption>
                        </figure>
                    </div>
                    <div class="gallery-item gallery-item-size-2">
                        <figure class="image">

                            <picture>
                                <img loading="lazy" src="holder.js/1280x720?auto=yes" width="1280" height="720" intrinsicsize="1280x720" title="Big Sur Road Trip, by Richard Nolan" alt="" />
                            </picture>

                            <figcaption class="caption">
                                https://unsplash.com/photos/jQ_RRJgun3s
                            </figcaption>
                        </figure>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ### End: Element image ### -->
 
{% for variant in variants %}
    {% include '@frame-image' with variant %}
{% endfor %}
 
{
  "data": {
    "image_zoom": false
  },
  "settings": {
    "lightbox": {
      "prefix": null,
      "cssClass": null
    }
  },
  "files": [
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "From above, by adrian",
        "description": "https://unsplash.com/photos/VKgBktwrtX0"
      }
    },
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "Cheers For The Years, by Felix Russell-Saw",
        "description": "https://unsplash.com/photos/XyoW1MhPqbs"
      }
    },
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "Photo by Geran de Klerk",
        "description": "https://unsplash.com/photos/WJkc3xZjSXw"
      }
    },
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "Bird eye’s view!, by Kimon Maritz",
        "description": "https://unsplash.com/photos/1-ISIwuBMiw"
      }
    },
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "Photo by Nikita Maru",
        "description": "https://unsplash.com/search/street-above?photo=2fZQFQ4FOPU"
      }
    },
    {
      "type": "image",
      "holder": {
        "width": 1280,
        "height": 720
      },
      "properties": {
        "title": "Big Sur Road Trip, by Richard Nolan",
        "description": "https://unsplash.com/photos/jQ_RRJgun3s"
      }
    }
  ],
  "variants": [
    {
      "header": "6 Images in 3 Columns",
      "data": {
        "imagecols": 3
      }
    },
    {
      "header": "4 images in 2 columns",
      "data": {
        "imagecols": 2
      }
    }
  ]
}

No notes defined.