From 275a34b0a25b7610b2123e913c6cf1a1989cdf05 Mon Sep 17 00:00:00 2001
From: James <jselby@jselby.net>
Date: Mon, 9 Jul 2018 21:13:17 +1000
Subject: [PATCH 1/2] Add screenshot renderer

---
 layouts/screenshots/single.html | 40 +++++++++++++++++++++++++++++++++
 1 file changed, 40 insertions(+)
 create mode 100644 layouts/screenshots/single.html

diff --git a/layouts/screenshots/single.html b/layouts/screenshots/single.html
new file mode 100644
index 0000000..b87fa75
--- /dev/null
+++ b/layouts/screenshots/single.html
@@ -0,0 +1,40 @@
+{{ define "main" }}
+<section class="section" id="gallery">
+    <h1 class="title">{{ .Title }}</h1>
+
+    {{ .Content }}
+
+    <div class="tile is-ancestor">
+    {{ $columns := 3 }}
+    {{ $files := readDir "/static/images/screenshots/" }}
+    {{ range $index, $element := (shuffle $files) }}
+    {{ $fileTitle := (index (split .Name "-") 1) }}
+    {{ $fileTitle := (index (split $fileTitle ".") 0) }}
+        <div class="tile is-parent">
+            <div class="tile is-child is-boxed">
+                <a href="/images/screenshots/{{ .Name }}" title="{{ $fileTitle }}">
+                    <figure class="image is-16by9">
+                        <img src="/images/screenshots/thumbs/{{ .Name }}" alt="{{ $fileTitle }}">
+                    </figure>
+                </a>
+            </div>
+        </div>
+    {{if eq (mod $index $columns) (sub $columns 1)}}
+    </div>
+    <div class="tile is-ancestor">
+    {{ end }}
+    {{ end }}
+    </div>
+</section>
+{{ end }}
+
+{{ define "scripts" }}
+<script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.js" type="text/javascript"></script>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.css" type="text/css" />
+
+<script type="text/javascript">
+    window.addEventListener("DOMContentLoaded", function() {
+        baguetteBox.run('#gallery');
+    });
+</script>
+{{ end }}

From f108e5d9f03b22a2da2bf9e68da03c4d7b47b01d Mon Sep 17 00:00:00 2001
From: James <jselby@jselby.net>
Date: Mon, 9 Jul 2018 21:25:52 +1000
Subject: [PATCH 2/2] Move per-page CSS to HTML head

---
 layouts/_default/baseof.html    | 7 ++++---
 layouts/screenshots/single.html | 5 ++++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index ad65e06..64cc4ed 100755
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -22,7 +22,8 @@
     <link href="https://fonts.googleapis.com/css?family=Ubuntu|Dosis" rel="stylesheet">
     <link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet">
     <link rel="stylesheet" href="{{ .Site.BaseURL }}/css/style.css" />
-    
+    {{- block "css" . }}{{- end }}
+
     {{ if eq (getenv "HUGO_ENV") "PRD" }}
     <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
     <script async src="https://www.googletagmanager.com/gtag/js?id={{ .Site.Params.GoogleAnalyticsTrackingId }}"></script>
@@ -46,7 +47,7 @@
     {{- end }}
 
     {{ .Render "header" }}
-    
+
     {{ block "header" . }}{{ end }}
 
     {{ $full_width := .Params.FullWidth | default false }}
@@ -87,4 +88,4 @@
     {{- end }}
 </body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/layouts/screenshots/single.html b/layouts/screenshots/single.html
index b87fa75..9560686 100644
--- a/layouts/screenshots/single.html
+++ b/layouts/screenshots/single.html
@@ -28,9 +28,12 @@
 </section>
 {{ end }}
 
+{{ define "css" }}
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.css" type="text/css" />
+{{ end }}
+
 {{ define "scripts" }}
 <script src="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.js" type="text/javascript"></script>
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/baguettebox.js/1.10.0/baguetteBox.min.css" type="text/css" />
 
 <script type="text/javascript">
     window.addEventListener("DOMContentLoaded", function() {