From 0fb507b61e58951d40eba865ef1e6f35217c452a Mon Sep 17 00:00:00 2001
From: Lorin Werthen <werthenlorin@gmail.com>
Date: Tue, 20 Dec 2016 13:44:02 +0100
Subject: [PATCH] work on blokmap

---
 .../assets/stylesheets/includes/general.scss  |  2 +-
 .../assets/stylesheets/includes/tiles.scss    | 32 ++++++++++++++++++-
 content/index.erb                             |  1 +
 layouts/tiles/blokmap.erb                     | 15 +++++++++
 4 files changed, 48 insertions(+), 2 deletions(-)
 create mode 100644 layouts/tiles/blokmap.erb

diff --git a/content/assets/stylesheets/includes/general.scss b/content/assets/stylesheets/includes/general.scss
index edfa085..9427b6f 100644
--- a/content/assets/stylesheets/includes/general.scss
+++ b/content/assets/stylesheets/includes/general.scss
@@ -61,7 +61,7 @@ footer.footer {
   background: rgba(255, 127, 0, 0.99);
 }
 
-.imgcenter {
+.has-content-centered, .imgcenter {
   display: flex;
   justify-content: center;
   align-items: center;
diff --git a/content/assets/stylesheets/includes/tiles.scss b/content/assets/stylesheets/includes/tiles.scss
index 3fc2cad..a62ba5f 100644
--- a/content/assets/stylesheets/includes/tiles.scss
+++ b/content/assets/stylesheets/includes/tiles.scss
@@ -68,5 +68,35 @@ a.box {
       }
     }
   }
-
+}
+
+#blokmap-tile {
+  position: relative;
+
+  height: 200px;
+  //background-image: url("https://i.imgur.com/PMaIG7X.jpg");
+  background-image: url("https://cldup.com/-FmSDFbd07.jpg");
+
+  background-position: center;
+
+  .overlay {
+    left: 0;
+    top: 0;
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    background-color: rgba(0, 0, 0, 0.2);
+  }
+
+  .content {
+    position: relative;
+
+    h1, h2 {
+      color: white;
+    }
+
+    h2 {
+      margin-top: 0;
+    }
+  }
 }
diff --git a/content/index.erb b/content/index.erb
index 6f1ecce..c3f03ba 100644
--- a/content/index.erb
+++ b/content/index.erb
@@ -6,6 +6,7 @@
 
 <div id="homepage">
   <div class="tile is-vertical is-ancestor">
+    <%= render '/tiles/blokmap.*' %>
     <div class="tile is-parent is-12">
       <div class="tile is-child box highlighted">
         <div class="content">
diff --git a/layouts/tiles/blokmap.erb b/layouts/tiles/blokmap.erb
new file mode 100644
index 0000000..894aa0d
--- /dev/null
+++ b/layouts/tiles/blokmap.erb
@@ -0,0 +1,15 @@
+<div class="tile is-parent is-12">
+  <div id="blokmap-tile" class="tile is-child box has-content-centered">
+    <a href="http://blok.ugent.be">
+      <div class="overlay"><!-- EMPTY --></div>
+      <div class="content is-large has-text-centered">
+        <h1>
+          <b>Zoek de beste plek om te blokken!</b>
+        </h1>
+        <h2>
+          blok.ugent.be
+        </h2>
+      </div>
+    </a>
+  </div>
+</div>