styling and markup

content/assets/stylesheets/includes/tiles.scss

@@ -1,5 +1,8 @@
-.notification.is-info {
+.notification.is-info,
+.notification.is-success,
+.notification.is-primary {
   .content {
+    color: white;
     h1 {
       color: white;
       font-weight: bold;

content/events/15-16/awk.md

@@ -1,6 +1,7 @@
 ---
 title: AWK-les
 banner: https://zeus.ugent.be/wp-content/uploads/2016/02/awkles-768x1007.jpg
+description: Een AWK-les voor AWK gerelateerde dingen
 created_at: 01-02-2016
 time: 23-02-2016
 location: Auditorium A1, Campus Sterre, Gebouw S9

content/index.erb

@@ -1,16 +1,83 @@
 <div class="tile is-vertical is-ancestor">
   <div class="tile is-parent is-12">
-    <div class="tile is-child">
+    <div class="tile is-child notification is-primary">
-      <%= render '/partials/_tile.*', article: sorted_articles[0] %>
+      <%= render '/partials/_tile.*', article: all_events[0] %>
     </div>
   </div>
   <div class="tile">
-    <% sorted_articles[1..-1].each do |article| %>
     <div class="tile is-parent is-4">
-      <div class="tile is-child">
+      <div class="tile is-child notification is-info">
-        <%= render '/partials/_tile.*', article: article %>
+        <%= render '/partials/_tile.*', article: all_events[1] %>
+      </div>
+    </div>
+    <div class="tile is-parent is-4">
+      <div class="tile is-child notification is-danger">
+        IDK LOL
+      </div>
+    </div>
+    <div class="tile is-vertical is-2">
+      <div class="tile is-parent">
+        <div class="tile is-child notification is-warning has-text-centered">
+          <%= fa 'wikipedia-w' %>
+        </div>
+      </div>
+      <div class="tile is-parent">
+        <div class="tile is-child notification is-warning has-text-centered">
+          <%= fa 'video-camera' %>
+        </div>
+      </div>
+    </div>
+    <div class="tile is-vertical is-2">
+      <div class="tile is-parent">
+        <div class="tile is-child notification is-warning has-text-centered">
+          <%= fa 'github' %>
+        </div>
+      </div>
+      <div class="tile is-parent">
+        <div class="tile is-child notification is-warning has-text-centered">
+          <%= fa 'facebook-official' %>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="tile">
+    <div class="tile is-4 is-parent">
+      <div class="tile is-child notification is-success">
+        <div class="content">
+          <h1><%= sorted_articles.first[:title] %></h1>
+          <%= sorted_articles.first[:description] %>
+        </div>
+      </div>
+    </div>
+    <div class="tile is-vertical">
+      <div class="tile is-parent">
+        <div class="tile is-child notification is-primary">
+          <p>
+            Numero uno: @werthen
+          </p>
+          <p>
+            Numero dos: @myncke
+          </p>
+          <p>
+            Numero tres: @iepoev
+          </p>
+          <p>
+            Numero quatro: @becousae
+          </p>
+        </div>
+      </div>
+      <div class="tile">
+        <div class="tile is-6 is-parent">
+          <div class="tile is-child notification">
+            GITHUB
+          </div>
+        </div>
+        <div class="tile is-6 is-parent">
+          <div class="tile is-child notification is-info">
+            GITHUB
+          </div>
+        </div>
       </div>
     </div>
-    <% end %>
   </div>
 </div>

layouts/eventpost.erb

@@ -26,21 +26,21 @@
 
 <section class="section">
   <div class="columns">
-
+    <!--
-    <div class="container">
+    <div id="event-info" class="column">
-      <div id="event-info" class="is-pulled-right">
+      <div class="box">
-        <div class="box">
+        <ul class="fa-ul">
-          <ul class="fa-ul">
+          <li><%= fa 'clock-o', li: true %><%= item[:time] %></li>
-            <li><%= fa 'clock-o', li: true %><%= item[:time] %></li>
+          <li><%= fa 'globe', li: true %><%= item[:location] %></li>
-            <li><%= fa 'globe', li: true %><%= item[:location] %></li>
+        </ul>
-          </ul>
-        </div>
       </div>
+    </div>
+    -->
+    <div class="column is-8 is-offset-2">
 
       <div class="content">
         <%= yield %>
       </div>
     </div>
-
   </div>
 </section>

layouts/generic.erb

@@ -19,6 +19,5 @@
         </a>
       </p>
     </div>
-    <!-- Place this tag where you want the button to render. -->
   </div>
 </footer>

layouts/partials/_navbar.erb

@@ -1,6 +1,6 @@
 <div id="navbar">
   <div class="columns">
-    <div class="column is-narrow">
+    <div class="column is-narrow is-hidden-mobile">
       <a id="logo-link" href="/">
         <img id="logo" src="https://zeus.ugent.be/wp-content/uploads/2009/05/logo-new.png" alt="" />
       </a>
@@ -8,7 +8,6 @@
     <div class="column">
       <nav class="nav">
           <div class="nav-left">
-
             <% nav_items do |item, active| %>
             <a class="nav-item is-tab <%= 'is-active' if active %>" href="<%= relative_path_to(item) %>">
               <%= item[:title] %>
@@ -16,7 +15,7 @@
             <% end %>
           </div>
 
-          <div class="nav-right">
+          <div class="nav-right is-hidden-mobile">
               <a class="nav-item" href="https://github.com/ZeusWPI" target="_blank">
                   <span class="icon">
                       <i class="fa fa-github"></i>

layouts/partials/_tile.erb

@@ -1,21 +1,19 @@
 <a href="<%= relative_path_to(@article) %>">
-  <div class="notification is-info">
+  <div class="main-tile">
-    <div class="main-tile">
+    <div class="content">
-      <div class="content">
+      <div class="columns">
-        <div class="columns">
+        <div class="column">
-          <div class="column">
+          <h1>
-            <h1>
+            <%= @article[:title] %>
-              <%= @article[:title] %>
+          </h1>
-            </h1>
+        </div>
-          </div>
+        <div class="column is-narrow">
-          <div class="column is-narrow">
+          <small>
-            <small>
+            <%= @article[:created_at] %>
-              <%= @article[:created_at] %>
+          </small>
-            </small>
-          </div>
         </div>
-        <%= @article[:description] %>
       </div>
+      <%= @article[:description] %>
     </div>
   </div>
 </a>