From 02c50ec543214fc9e859da76b9ab2a451d7e125a Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Tue, 9 May 2017 21:04:08 +0100
Subject: [PATCH] Fix main images on content

---
 content/robotics/_index.md   |  2 +-
 layouts/_default/list.html   | 22 ++++++++++++----------
 layouts/_default/single.html |  2 +-
 layouts/projects/single.html |  2 +-
 static/src/js/index.js       | 10 ++++++++++
 static/src/scss/style.scss   | 10 ++++++++--
 6 files changed, 33 insertions(+), 15 deletions(-)

diff --git a/content/robotics/_index.md b/content/robotics/_index.md
index 8fea086..2e340d0 100644
--- a/content/robotics/_index.md
+++ b/content/robotics/_index.md
@@ -2,7 +2,7 @@
 title: Student Robotics
 linktitle: Robotics
 image: https://farm4.staticflickr.com/3849/33683313131_6ba584094a_k_d.jpg
-show_images: true
+hide_pages: false
 ---
 
 Student Robotics is the the place where my development knowledge really started to grow. Thanks to the other people in my team teaching me. I had never done anything robotics related, and so when my computing teacher initially told us about it, I wasn't really interested. After I found out that my friend was also doing it, I signed up, and went along to the kickstart. From then on I was hooked, getting involved with all aspects of the development and design, as well as helping out other teams on the IRC room.
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 2f8abcb..b0d9a46 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -7,21 +7,23 @@
     {{ if .Content }}
   		<div class="box">
         {{ if .Params.image }}
-    			<span class="image featured"><img src="{{ .Params.image }}" alt="{{ .Title }} image" /></span>
+    			<span class="image featured main" data-image="{{ .Params.image }}"></span>
         {{ end }}
         {{ .Content }}
   		</div>
     {{ end }}
-    <div class="row">
-      {{ $parent := . }}
-      {{ range where .Pages.ByTitle "Params.show_in_nav" "!=" "false" }}
-        {{ if $parent.Params.show_images }}
-          {{ partial "box_image.html" . }}
-        {{ else }}
-          {{ partial "box.html" . }}
+    {{ if ne .Params.hide_pages "true" }}
+      <div class="row">
+        {{ $parent := . }}
+        {{ range where .Pages.ByTitle "Params.show_in_nav" "!=" "false" }}
+          {{ if $parent.Params.show_images }}
+            {{ partial "box_image.html" . }}
+          {{ else }}
+            {{ partial "box.html" . }}
+          {{ end }}
         {{ end }}
-      {{ end }}
-    </div>
+      </div>
+    {{ end }}
 	</section>
 </div>
 {{ partial "page_end.html" . }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 365518d..b6a79df 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -9,7 +9,7 @@
 		</header>
 		<div class="box">
       {{ if .Params.image }}
-  			<span class="image featured"><img src="{{ .Params.image }}" alt="{{ .Title }} image" /></span>
+        <span class="image featured main" data-image="{{ .Params.image }}"></span>
       {{ end }}
       {{ .Content }}
 		</div>
diff --git a/layouts/projects/single.html b/layouts/projects/single.html
index 1e58893..dfe3919 100644
--- a/layouts/projects/single.html
+++ b/layouts/projects/single.html
@@ -9,7 +9,7 @@
 		</header>
 		<div class="box">
       {{ if .Params.image }}
-  			<span class="image featured"><img src="{{ .Params.image }}" alt="{{ .Title }} image" /></span>
+        <span class="image featured main" data-image="{{ .Params.image }}"></span>
       {{ end }}
       {{ .Content }}
 		</div>
diff --git a/static/src/js/index.js b/static/src/js/index.js
index ca8c5e5..940a35f 100644
--- a/static/src/js/index.js
+++ b/static/src/js/index.js
@@ -7,3 +7,13 @@ require('bootstrap');
 require('./alpha/jquery.dropotron.min');
 require('./alpha/util');
 require('./alpha/main');
+
+
+$('.image').each(function () {  // setup div-image hybrids
+  var ele = $(this);
+  if (ele.data('image')) {
+    ele.css('background-image', 'url(' + ele.data('image') + ')');
+  } else {
+    ele.removeClass('image');
+  }
+});
diff --git a/static/src/scss/style.scss b/static/src/scss/style.scss
index 67cc855..d4b35d1 100644
--- a/static/src/scss/style.scss
+++ b/static/src/scss/style.scss
@@ -32,6 +32,12 @@ pre code {
   padding: 0;
 }
 
-.image.featured {
-  max-height: 45vh;
+.image {
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: cover;
+
+  &.featured.main {
+    height: 40vh;
+  }
 }