{{ define "main" }}
<section class="section">
  <article>
    <div class="content portfolio">
      <h1>{{ .Title }}</h1>
      <div id="portfolio-gallery">
        {{ range $index, $element := .Params.images }}
        {{ $img := $.Page.Resources.GetMatch $element }}
        {{ $res_img := $img.Fill (cond (eq $index 0) "1920x1080" "640x360") }}
        <a href="{{ $img.RelPermalink }}">
          <img src="{{ $res_img.RelPermalink }}" alt="">
        </a>
        {{ end }}
      </div>
      {{ .Content }}
    </div>
  </article>
</section>
<script src="https://cdn.jsdelivr.net/npm/lightgallery.js@1.4.0/dist/js/lightgallery.min.js" integrity="sha256-0Zhc9IDI5elFpwJZlvdAM4u/6qlxi4qIOUlHDVl5wjU=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/lg-zoom.js@1.3.0/dist/lg-zoom.min.js" integrity="sha256-pw9GIEB9jGoek+S5xfa2Uz/8dZVjZsIYVJxy3jK3qgI=" crossorigin="anonymous"></script>
<script>
  lightGallery(document.getElementById('portfolio-gallery'));
</script>
{{ end }}