From d5f6c306e439e48ea9af5af66d837a98d43049c3 Mon Sep 17 00:00:00 2001
From: Rien Maertens <maertensrien@gmail.com>
Date: Mon, 9 Apr 2018 23:43:23 +0200
Subject: [PATCH] Panorama photos full width, add photo album

---
 content/assets/stylesheets/includes/blogpost.scss | 10 ++++++++++
 content/blog/17-18/vleor.md                       |  6 ++++--
 lib/helpers/blog.rb                               |  4 ++--
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/content/assets/stylesheets/includes/blogpost.scss b/content/assets/stylesheets/includes/blogpost.scss
index 8c02405..4bd7999 100644
--- a/content/assets/stylesheets/includes/blogpost.scss
+++ b/content/assets/stylesheets/includes/blogpost.scss
@@ -115,3 +115,13 @@ $sel: '';
     width: 100%;
   }
 }
+
+img.full-width {
+  margin-left: -50vw;
+  margin-right: -50vw;
+  width: 100vw;
+  max-width: 100vw;
+  position: relative;
+  left: 50%;
+  right: 50%;
+}
diff --git a/content/blog/17-18/vleor.md b/content/blog/17-18/vleor.md
index b21af53..3818568 100644
--- a/content/blog/17-18/vleor.md
+++ b/content/blog/17-18/vleor.md
@@ -61,7 +61,7 @@ De zwaardere en grotere voorwerpen werden in de gang gesmeten.
 <%= figure 'https://zeus.ugent.be/zeuswpi/1RXca_tJ.jpg', 'Volop aan het werken' %>
 
 
-<%= figure 'https://zeus.ugent.be/zeuswpi/SM5ToXlH.jpg', 'Lege kelder in panorama' %>
+<%= figure 'https://zeus.ugent.be/zeuswpi/SM5ToXlH.jpg', 'Lege kelder in panorama', img_class: 'full-width' %>
 
 
 <%= figure 'https://zeus.ugent.be/zeuswpi/dLDR0GR4.jpg', 'Volledig leeg, op een bedankingkje voor de noeste arbeiders na' %>
@@ -94,7 +94,9 @@ Doorheen de dag konden nieuwsgierige voorbijgangers bewonderen en vooral horen h
 
 <%= figure 'https://zeus.ugent.be/zeuswpi/XkLhaJVu.jpg', 'Uiteraard werd de nieuwe zetelopstelling uitgebreid getest.' %>
 
-<%= figure 'https://zeus.ugent.be/zeuswpi/trZFwU90.jpg', 'Het eindresultaat' %>
+<%= figure 'https://zeus.ugent.be/zeuswpi/trZFwU90.jpg', 'Het eindresultaat', img_class: 'full-width' %>
+
+[Hier](https://photos.app.goo.gl/msViDCs4CtUFM90D2) kun je nog eens nagenieten van de volledige fotoreportage.
 
 Tot slot dankt Zeus en zijn bezoekers de volgende mensen voor hun bijdrage aan het bannen van rood stof uit onze levens:
 
diff --git a/lib/helpers/blog.rb b/lib/helpers/blog.rb
index 41deabe..bb06ad9 100644
--- a/lib/helpers/blog.rb
+++ b/lib/helpers/blog.rb
@@ -14,12 +14,12 @@ module BlogHelper
     end
   end
 
-  def figure(img_url, caption, alt = nil)
+  def figure(img_url, caption, alt = nil, img_class: nil)
     alt ||= caption
     <<~HTML
       <figure class="image">
       <a href="#{img_url}">
-      <img src="#{img_url}" alt="#{alt}">
+      <img src="#{img_url}" alt="#{alt}" class="#{img_class}">
       </a>
       <figcaption>#{caption}</figcaption>
       </figure>