first work into renewed gallery

layouts/shortcodes/snap-gallery.html

@@ -0,0 +1,53 @@
+<link rel="stylesheet" href="/css/snap-gallery.css" />
+<script src="/js/snap-gallery.js"></script>
+
+{{/*  Initialise variables  */}}
+{{ $imgs := slice }}
+
+
+{{ if .Params.isdir }}
+  {{/*  Get images from folder, somehow put into map  */}}
+{{ else }}
+  {{ range (split .Params.src ",") }}
+    {{ $imgs = $imgs | append (trim . " ") }}
+  {{ end }}
+{{ end }}
+
+{{/*  Visible images  */}}
+<div class="row">
+{{ range $i, $img := $imgs }}
+  <div class="column">
+    <img src="{{ $img }}" onclick="openModal();currentSlide({{ add $i 1 }});" class="hover-shadow">
+  </div>
+{{ end }}
+</div>
+
+{{/*  The Modal/Lightbox  */}}
+<div id="myModal" class="modal">
+  <span class="close cursor" onclick="closeModal()">&times;</span>
+  <div class="modal-content">
+
+    {{ range $i, $img := $imgs }}
+    <div class="mySlides">
+      <div class="numbertext">{{ add $i 1 }} / {{ len $imgs }}</div>
+      <img src="{{ $img }}" style="width:100%">
+    </div>
+    {{ end }}
+
+    <!-- Next/previous controls -->
+    <a class="prev" onclick="plusSlides(-1)">&#10094;</a>
+    <a class="next" onclick="plusSlides(1)">&#10095;</a>
+
+    <!-- Caption text -->
+    <div class="caption-container">
+      <p id="caption"></p>
+    </div>
+
+    <!-- Thumbnail image controls -->
+    {{ range $i, $img := $imgs }}
+    <div class="column">
+      <img class="demo" src="{{ $img }}" onclick="currentSlide({{ add $i 1 }})" alt="Nature">
+    </div>
+    {{ end }}
+  </div>
+</div>