Add current version + blog posts to frontpage

sass/custom/_paulus.scss

@@ -33,6 +33,49 @@
   }
 }
 
+.material-card {
+  // display: inline-block;
+  background-color: #fefefe;
+  border-radius: 2px;
+  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2);
+
+  h1 {
+    font-family: Roboto, Noto, sans-serif;
+    -webkit-font-smoothing: antialiased;
+    font-size: 24px;
+    font-weight: 400;
+    letter-spacing: -.012em;
+    line-height: 40px;
+    color: #212121;
+    padding: 20px 16px 12px;
+    text-transform: capitalize;
+    margin: 0;
+  }
+
+  &.text {
+    padding: 16px;
+
+    h1 {
+      padding: 4px 0px 12px;
+    }
+  }
+}
+
+.frontpage {
+
+  .current-version {
+    margin-bottom: 16px;
+
+    .release-date {
+      white-space: nowrap;
+    }
+  }
+
+  .blog-date {
+    white-space: nowrap;
+  }
+}
+
 .supported-brands {
   text-align: center;
   img {

source/index.html

@@ -12,6 +12,28 @@ hide_github_edit: true
 ---
 
 <div class="grid-wrapper frontpage">
+  <div class="grid">
+    <div class="grid__item one-third lap-one-third palm-one-whole">
+      <div class='current-version material-card text'>
+        <h1>Current: 0.21.1</h1>
+        Released: <span class='release-date'>June 12, 2016</span><br>
+        <a href='/blog/2016/06/08/super-fast-web-enocean-lirc/'>Release notes</a>
+      </div>
+    </div>
+    <div class="grid__item two-thirds lap-two-thirds palm-one-whole">
+      <div class='material-card text'>
+        <h1>Latest blog items</h1>
+
+        {% for post in site.posts limit: 3 %}
+          <li class="post">
+            <a href="{{ root_url }}{{ post.url }}">{{ post.title }}</a>
+            <small class='blog-date'>{{ post.date_formatted }}</small>
+          </li>
+        {% endfor %}
+      </div>
+    </div>
+  </div>
+
   <div class="grid">
     <div class="grid__item one-third lap-one-whole palm-one-whole usp">
       <div class="grid">