{{ range where .Site.RegularPages "Section" "gallery" }}

  <!-- First 4 characters of each gallery page's unique ID -->
  {{ $modalID := (slicestr .File.UniqueID 0 4) }}

  <div id="modal-{{ $modalID }}" class="modal">

    <!-- Modal box -->
    <div class="modal-box">
      <span class="close">&times;</span>
      <div class="modal-container">

        <div class="modal-header">
          <div class="modal-header-img-container" {{ if .Params.color }}style="background-color:{{ .Params.color }}"{{ end }}>
            <img {{ if .Site.Params.lazyLoading }}data-src="{{ "images/" | relURL }}{{ .Params.image}}" class="lazyload"{{ else }}src="{{ "images/" | relURL }}{{ .Params.image}}"{{ end }} {{ if .Params.alt }}alt="{{ .Params.alt }}"{{ end }}>
          </div>
        </div>

        <div class="modal-content">
          <h2>{{ .Params.title }}</h2>

          <article class="entry-content">
            {{ .Content }}
          </article>

          {{ if .Params.link1 }}<h3><a href="{{ .Params.link1 }}">{{ i18n "view" }}</a></h3>{{ end }}
          {{ if .Params.link2 }}<h3><a href="{{ .Params.link2 }}">{{ i18n "code" }}</a></h3>{{ end }}
        </div>

      </div>
    </div>

  </div>
{{ end }}