less mockup, more real deal

content/index.erb

@@ -25,12 +25,14 @@
       </nav>
     </header>
     <main>
+      <a href="<%= relative_path_to(sorted_articles.first) %>">
         <div class="main-event">
-        <img class="pure-img" src="https://zeus.ugent.be/wp-content/uploads/2016/02/battlebots_small.jpg" alt="" />
+          <img class="pure-img" src='<%= sorted_articles.first[:banner] %>' alt="" />
         </div>
+      </a>
       <div id="all-events">
         <div class="pure-g">
-          <% articles.each do |article| %>
+          <% sorted_articles[1..-1].each do |article| %>
           <div class="pure-u-1-3">
             <a href="<%= relative_path_to(article) %>">
               <div class="event">

content/posts/awk.md

@@ -0,0 +1,14 @@
+---
+title: AWK-les
+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
+kind: article
+---
+
+Op **dinsdag 23 februari 18:00** (na de les Scriptingtalen) in **Auditorium A1** organiseren we een **AWK-les** gegeven door **professor Peter Dawyndt**.
+
+**AWK** is een scriptingtaal, bedoeld om lijn per lijn tekstbestanden te verwerken. Zo wordt AWK vaak gebruikt voor de ingebouwde werking met delimiters om CSV bestanden en dergelijke te verwerken. AWK staat tevens bekend om de talloze [one-liners](http://www.pement.org/awk/awk1line.txt) die in de command line gebruikt kunnen worden.
+
+Sinds vorig jaar wordt AWK (samen met sed) niet meer gegeven in het vak Scriptingtalen, om meer te kunnen concentreren op Python en JavaScript. Hoewel deze zeer goede general purpose talen zijn, blijft AWK ongeëvenaard voor razendsnelle tekstverwerking en transformaties.

content/stylesheet.scss

@@ -1,6 +1,7 @@
 $zeus_orange: #FF7F00;
 $event-padding: 10px;
 $navbar-border-color: #CCC;
+$event-border-color: #DDD;
 
 $cammie-controls-color: rgba(0, 0, 0, 0.60);
 
@@ -25,6 +26,10 @@ html, body {
   height: 150px;
 }
 
+a, a:hover, a:visited, a:link, a:active {
+  color: $zeus_orange;
+}
+
 #logos {
   display: inline-block;
   color: black;
@@ -70,13 +75,20 @@ html, body {
   .navlink {
     padding: 8px;
     transition: 0.2s;
+
+    a, a:hover, a:visited, a:link, a:active {
+      text-decoration: none;
+      color: black;
+    }
   }
 
   .navlink:hover {
     background-color: $zeus_orange;
-    color: white;
-
     transition: 0.2s;
+
+    a {
+      color: white;
+    }
   }
 }
 
@@ -84,6 +96,7 @@ html, body {
   height: 250px;
   margin-bottom: $event-padding;
   overflow: hidden;
+  border: 2px solid $event-border-color;
 }
 
 #all-events {
@@ -91,7 +104,7 @@ html, body {
   margin-right: -10px;
 
   .event {
-    border: 2px solid #DDD;
+    border: 2px solid $event-border-color;
     position: relative;
 
     overflow: hidden;

layouts/eventpost.erb

@@ -19,10 +19,13 @@
   <div class="pure-g">
     <!-- Wrapper needed to add some padding to the grid class -->
     <div id="event-description-wrapper" class="pure-u-3-4">
+      <div class="pure-u-1-6"></div>
+      <div class="pure-u-2-3">
         <div id="event-description">
           <%= yield %>
         </div>
       </div>
+    </div>
     <div id="event-info" class="pure-u-1-4">
       <ul class="fa-ul">
         <li><i class="fa-li fa fa-clock-o"></i><%= item[:time] %></li>