From 3960b0b4460a1f5c2dde72dc741cac524ce1feab Mon Sep 17 00:00:00 2001
From: Sergey Lukin <contact@sergeylukin.com>
Date: Wed, 16 May 2012 10:07:29 -0400
Subject: [PATCH] Positioned social buttons + Added Google+

---
 css/general.css    |  6 +++---
 css/responsive.css |  2 +-
 index.html         | 11 +++++++++--
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/css/general.css b/css/general.css
index 81c879f..d2904da 100644
--- a/css/general.css
+++ b/css/general.css
@@ -57,10 +57,10 @@ input#empty:checked ~ .bar-wrapper .bar-inner { height: 0; bottom: -2.5em; }
 }
 
 /*------------------------------------*\
- *  Twitter
+ *  Social buttons (like Tweet, G+ etc.)
 \*------------------------------------*/
-.twitter-share-button {
+.social-buttons {
   position: absolute;
-  bottom: 1em;
+  bottom: 0;
   left: 1em;
 }
diff --git a/css/responsive.css b/css/responsive.css
index 21dc304..1ec4b6e 100644
--- a/css/responsive.css
+++ b/css/responsive.css
@@ -12,7 +12,7 @@
     #github {
       display: none;
     }
-    .twitter-share-button {
+    .social-buttons {
       position: static;
     }
     .bar-wrapper {
diff --git a/index.html b/index.html
index 1fe4d9f..1f7730d 100644
--- a/index.html
+++ b/index.html
@@ -37,8 +37,15 @@ <h1>Pure CSS 3D Bar Graph</h1>
 
   <br />
 
-  <a href="https://twitter.com/share" class="twitter-share-button" data-via="sergey_lukin" data-hashtags="css">Tweet</a>
-  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
+  <div class="social-buttons">
+    <!-- Twitter button -->
+    <a href="https://twitter.com/share" class="twitter-share-button" data-via="sergey_lukin" data-hashtags="css">Tweet</a>
+    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
+    
+    <!-- Google Plus button -->
+    <div class="g-plusone" data-size="medium"></div>
+    <script type="text/javascript">(function() {var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;po.src = 'https://apis.google.com/js/plusone.js';var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);})();</script>
+  </div>
 
   <!-- GitHub fork ribbon -->
   <a href="https://github.com/sergeylukin/css-3d-bar-graph" id="github"><img style="position: absolute; top: 0; right: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub" /></a>