yolo

content/assets/stylesheets/includes/animations.scss

@@ -0,0 +1,9 @@
+.blog-heading {
+  .title {
+    animation-delay: 0.5s;
+  }
+
+  .subtitle, .details {
+    animation-duration: 1.5s;
+  }
+}

content/assets/stylesheets/main.scss

@@ -22,6 +22,7 @@ body.site {
 }
 
 
+@import "includes/animations";
 @import "includes/cammie";
 @import "includes/events";
 @import "includes/tiles";

content/blog/16-17/linux.md

@@ -10,6 +10,12 @@ toc:
 _Bij het begin van ieder schooljaar komt er een verse lading studenten Informatica toe. In de lessen Computergebruik maken ze kennis met de wondere wereld van GNU/Linux.
 Velen onder hen worden geprikkeld door de onontgonnen mysteries van dit besturingssysteem en groeien een verlangen om zich de kunst van het Unix-tovenaarschap eigen te maken._
 
+~~~ ruby
+def what?
+  42
+end
+~~~
+
 Deze blogpost dient als een leidraad voor de dappersten onder hen: zij die het pad naar de verlossing willen bewandelen en een eigen Linux-installatie tot leven willen wekken.
 
 # Enkele tips voor je begint

layouts/blogpost.erb

@@ -1,14 +1,14 @@
 <div class="blog-heading">
   <div class="titlewrap">
-    <h1 class="title is-1 has-text-centered">
+    <h1 class="title is-1 has-text-centered animated fadeIn">
       <%= item[:title] %>
     </h1>
     <% if item[:author] %>
-    <h2 class="subtitle is-3 has-text-centered">
+    <h2 class="subtitle is-3 has-text-centered animated fadeInLeft">
       door <%= item[:author] %>
     </h2>
     <% end %>
-    <div class="details">
+    <div class="details animated fadeInRight">
       <small>
         Geschreven op <%= item[:created_at] %><br>
         Leestijd: <%= reading_time @item %>
@@ -17,6 +17,6 @@
   </div>
 </div>
 
-<div class="columns">
+<div class="columns animated fadeIn">
   <%= yield %>
 </div>