From 5249c1d5fac6a602d90e578e132ab4e155f3d663 Mon Sep 17 00:00:00 2001
From: myncke <ohsab@github.com>
Date: Sat, 27 Aug 2016 00:36:10 +0200
Subject: [PATCH] first iteration event preview

---
 .../assets/stylesheets/includes/events.scss   | 64 ++++++++++++++++++-
 content/events.erb                            | 44 +++++++++----
 content/events/15-16/awk.md                   |  1 +
 3 files changed, 96 insertions(+), 13 deletions(-)

diff --git a/content/assets/stylesheets/includes/events.scss b/content/assets/stylesheets/includes/events.scss
index f49e964..b517c6a 100644
--- a/content/assets/stylesheets/includes/events.scss
+++ b/content/assets/stylesheets/includes/events.scss
@@ -1,3 +1,63 @@
-.subevent {
-  margin-left: 20px;
+.box.event-preview {
+  border-radius: 0px;
+  display: flex;
+  align-items: center;
+  box-shadow : none;
+  margin-bottom: 0px;
+
+  border-top: 1px solid lighten(gray, 15%);
+
+  .image-holder {
+    border-radius: 50%;
+    padding: 10px;
+    border: 1px solid lighten(gray, 30%);
+    width: 15%;
+    height: 15%;
+  }
+
+  .image {
+    border-radius: 50%;
+    vertical-align: middle;
+    border: 1px solid gray;
+  }
+
+  .info {
+    margin: 1.5em;
+    box-shadow : none;
+
+    .title {
+      font-size: 1.7em;
+      font-weight: 500;
+      margin-bottom: 0;
+      a {
+        color: darken(gray, 20%);
+      }
+      a:hover {
+        border-bottom: none;
+        color: #FF7F00;
+      }
+    }
+
+    .location  {
+      font-size: .9em;
+      a {
+        color: lighten(gray, 10%);
+      }
+    }
+
+    .description {
+      font-size: 1.7em;
+      font-weight: 200;
+      color: #FF7F00;
+    }
+
+    .time {
+      font-size: 1.6em;
+      font-weight: 400;
+    }
+
+    .subevent {
+      margin-left: 20px;
+    }
+  }
 }
diff --git a/content/events.erb b/content/events.erb
index 107c531..b91e179 100644
--- a/content/events.erb
+++ b/content/events.erb
@@ -9,17 +9,39 @@ title: Events
   </div>
 
   <% all_events.each do |event| %>
-  <div class="box">
-    <a href="<%= relative_path_to(event) %>">
-      <%= event[:title] %>
-    </a>
-    <% sub_events(event).each do |sub_event| %>
-    <div class="subevent">
-      <a href="<%= relative_path_to(sub_event) %>">
-        <%= sub_event[:title] %>
-      </a>
+    <div class="box event-preview">
+      <div class="image-holder">
+        <img src="http://placehold.it/150x150" alt="" class="image" />
+      </div>
+
+      <div class="box info">
+        <div class="title">
+          <a href="<%= relative_path_to(event) %>">
+            <%= event[:title] %>
+          </a>
+        </div>
+        <div class="location">
+          <a href="#">
+            <%= event[:location] %>
+          </a>
+        </div>
+
+        <div class="description">
+          <%= event[:description] %>
+        </div>
+
+        <div class="time">
+          <%= event[:time] %>
+        </div>
+
+        <% sub_events(event).each do |sub_event| %>
+          <div class="subevent">
+            <a href="<%= relative_path_to(sub_event) %>">
+              <%= sub_event[:title] %>
+            </a>
+          </div>
+        <% end %>
+      </div>
     </div>
-    <% end %>
-  </div>
   <% end %>
 </div>
diff --git a/content/events/15-16/awk.md b/content/events/15-16/awk.md
index 3a49a7a..825debd 100644
--- a/content/events/15-16/awk.md
+++ b/content/events/15-16/awk.md
@@ -4,6 +4,7 @@ banner: https://zeus.ugent.be/wp-content/uploads/2016/02/awkles-768x1007.jpg
 created_at: 01-02-2016
 time: 23-02-2016
 location: Auditorium A1, Campus Sterre, Gebouw S9
+description: Dit is een description van het awk event!
 ---
 
 Op **dinsdag 23 februari 18:00** (na de les Scriptingtalen) in **Auditorium A1** organiseren we een **AWK-les** gegeven door **professor Peter Dawyndt**.