Add sidebar

_includes/sidebar.html

@@ -0,0 +1,8 @@
+<img src="/assets/images/me.png" class="me"/>
+<p>Welcome to Netflux.io, the personal tech blog of Rob Watson.</p>
+<p>I am co-founder and CTO of <a href="http://mixlr.com">Mixlr</a>.
+<p>You can find me on <a href="https://twitter.com/rfwatson">Twitter</a>, <a href="https://github.com/rfwatson">GitHub</a> and <a href="https://gitlab.com/rfwatson">GitLab</a>.
+</p>
+<p><a href="https://twitter.com/rfwatson" target="_blank"><img src="/assets/images/follow.png"></a></p>
+<p>You can also subscribe to this blog via <a href="/feed.xml">RSS</a>.</p>
+

about.md

@@ -1,6 +1,7 @@
 ---
 layout: page
 title: About
+sidebar: false
 permalink: /about/
 ---
 

assets/main.scss

@@ -34,6 +34,8 @@ body > header {
   }
 
   .site-nav {
+    z-index: 1;
+
     .page-link, .page-link:visited {
       font-family: 'Archivo Black';
       color: #fff;
@@ -45,6 +47,10 @@ body > header {
   }
 }
 
+.outer-wrapper {
+  box-shadow: 5px 2px 15px -4px rgba(0, 0, 0, 0.2);
+}
+
 .page-content {
   background: #efefef;
   padding-top: 0px;
@@ -55,7 +61,32 @@ body > header {
   background: #fff;
 }
 
-img.profile {
-  width: 400px;
+.post-content p {
+  line-height: 2em;
 }
 
+img.profile {
+  width: 300px;
+}
+
+.sidebar {
+  line-height: 1.3em;
+  background: #ddd;
+
+  img.me {
+    width: 140px;
+    border-radius: 180px;
+    display: block;
+    margin: 20px auto;
+  }
+
+  a[href*=twitter] img {
+    width: 120px;
+    display: block;
+    margin: 25px auto;
+  }
+}
+
+.share-buttons {
+  line-height: 1em;
+}