From 0a36e6933df5aa03ce6367a5d4ad1f43ec7dd2c8 Mon Sep 17 00:00:00 2001
From: Ariejan de Vroom <ariejan@ariejan.net>
Date: Thu, 20 Nov 2014 14:50:18 +0100
Subject: [PATCH] Update layout; Add social icons and CB tip button

---
 content/css/screen.sass | 17 +++++++----------
 layouts/default.haml    | 10 +++++-----
 layouts/post.haml       | 35 ++++++++++++++++++++++++++++-------
 3 files changed, 40 insertions(+), 22 deletions(-)

diff --git a/content/css/screen.sass b/content/css/screen.sass
index fa2f432..2c3ce49 100644
--- a/content/css/screen.sass
+++ b/content/css/screen.sass
@@ -234,14 +234,11 @@ pre
     color: $footer-color
     text-align: center
 
-#appreciation
-  margin-top: 1em
-  border: 1px solid #e0e0e0
-  background-color: #fffff7
-  border-radius: 4px
-  padding: 10px 20px 0 20px
-
-  #donate-button
-    margin-left: 8px
-
+.share-buttons
+  list-style: none
+  font-size: 130%
+  text-align: right
+  margin-top: -2px
 
+.share-buttons li
+  display: inline
diff --git a/layouts/default.haml b/layouts/default.haml
index 56c3363..6edfb54 100644
--- a/layouts/default.haml
+++ b/layouts/default.haml
@@ -19,7 +19,7 @@
     %link(href="https://ariejan.net/rss.xml" rel="alternate" type="application/rss+xml" title="RSS")
 
     %link(href="/css/screen.css" rel="stylesheet" type="text/css" media="screen")
-    %link(href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet")
+    %link(href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet")
 
     %title= "#{@item[:title]} — ariejan de vroom"
 
@@ -39,19 +39,19 @@
           %ol.social
             %li
               %a(href="https://github.com/ariejan")
-                %i.icon-github
+                %i.fa.fa-github
 
             %li
               %a(href="https://twitter.com/ariejan")
-                %i.icon-twitter
+                %i.fa.fa-twitter
 
             %li
               %a(href="http://www.linkedin.com/in/ariejan")
-                %i.icon-linkedin
+                %i.fa.fa-linkedin
 
             %li
               %a(href="https://ariejan.net/rss.xml")
-                %i.icon-rss
+                %i.fa.fa-rss
 
       .row#main
         .col-sm-12
diff --git a/layouts/post.haml b/layouts/post.haml
index 27096ee..32a926f 100644
--- a/layouts/post.haml
+++ b/layouts/post.haml
@@ -15,13 +15,34 @@
 
         = yield
 
-      #appreciation
-        %small
-          Did you enjoy this post? Your generosity is much appreciated.
-          %br
-          %span#donate-button
-            :plain
-              <a class="coinbase-button" data-code="95beb1cb8404aa9476f24d13be4e6d16" data-button-style="custom_small" data-custom="ARIEJANNET-DONATION" href="https://coinbase.com/checkouts/95beb1cb8404aa9476f24d13be4e6d16">Donate Bitcoins</a><script src="https://coinbase.com/assets/button.js" type="text/javascript"></script> 
+        .col-sm-6
+          :plain
+            <div class="cb-tip-button" data-content-location="" data-href="//www.coinbase.com/tip_buttons/show_tip" data-to-user-id="50750fd9cd9ad80200000197"></div>
+
+          :javascript
+            !function(d,s,id) {var js,cjs=d.getElementsByTagName(s)[0],e=d.getElementById(id);if(e){return;}js=d.createElement(s);js.id=id;js.src="https://www.coinbase.com/assets/tips.js";cjs.parentNode.insertBefore(js,cjs);}(document, 'script', 'coinbase-tips');
+
+        .col-sm-6
+          %ul.share-buttons
+            %li
+            %li
+              %a(href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fariejan.net&t=" target="_blank" onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(document.URL) + '&t=' + encodeURIComponent(document.URL)); return false;")
+                %i.fa.fa-facebook-square
+            %li
+              %a(href="https://twitter.com/intent/tweet?source=http%3A%2F%2Fariejan.net&text=:%20http%3A%2F%2Fariejan.net&via=ariejan" target="_blank" title="Tweet" onclick="window.open('https://twitter.com/intent/tweet?text=' + encodeURIComponent(document.title) + ':%20'  + encodeURIComponent(document.URL)); return false;")
+                %i.fa.fa-twitter
+            %li
+              %a(href="https://plus.google.com/share?url=http%3A%2F%2Fariejan.net" target="_blank" title="Share on Google+" onclick="window.open('https://plus.google.com/share?url=' + encodeURIComponent(document.URL)); return false;")
+                %i.fa.fa-google-plus
+            %li
+              %a(href="http://www.reddit.com/submit?url=http%3A%2F%2Fariejan.net&title=" target="_blank" title="Submit to Reddit" onclick="window.open('http://www.reddit.com/submit?url=' + encodeURIComponent(document.URL) + '&title=' +  encodeURIComponent(document.title)); return false;")
+                %i.fa.fa-reddit
+            %li
+              %a(href="http://www.linkedin.com/shareArticle?mini=true&url=http%3A%2F%2Fariejan.net&title=&summary=&source=http%3A%2F%2Fariejan.net" target="_blank" title="Share on LinkedIn" onclick="window.open('http://www.linkedin.com/shareArticle?mini=true&url=' + encodeURIComponent(document.URL) + '&title=' +  encodeURIComponent(document.title)); return false;")
+                %i.fa.fa-linkedin
+            %li
+              %a(href="mailto:?subject=&body=:%20http%3A%2F%2Fariejan.net" target="_blank" title="Email" onclick="window.open('mailto:?subject=' + encodeURIComponent(document.title) + '&body=' +  encodeURIComponent(document.URL)); return false;")
+                %i.fa.fa-envelope
 
       #recent-posts
         %h3 Recent posts on <strong>ariejan.net</strong>