share buttons

puzzlet · Mar 31, 2013 · 5c0c48f · 5c0c48f
1 parent fd7db11
commit 5c0c48f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 5 deletions.
diff --git a/src/_desktop.html b/src/_desktop.html
@@ -79,7 +79,10 @@
             <div class="band">
                 <div class="gripper"></div>
                 <ul class="toolbar quick-launch">
-                    <li data-icon="ie5" title="{{ gettext("Start Internet Explorer") }}"></li>
+                    <!-- TODO: URL as variable -->
+                    <li data-icon="facebook" title="{{ gettext("Share on Facebook") }}"><a target="_blank" href="https://www.facebook.com/sharer.php?u=http://puzzlet.github.com/fake-mswin/"></a></li>
+                    <li data-icon="twitter" title="{{ gettext("Share on Twitter") }}"><a target="_blank" href="https://twitter.com/share?url=http://puzzlet.github.com/fake-mswin/"></a></li>
+                    <li data-icon="github" title="{{ gettext("Fork on GitHub") }}"><a target="_blank" href="https://github.com/puzzlet/fake-mswin"></a></li>
                 </ul>
             </div>
             <div class="band tasks">

diff --git a/src/css/_win95_common.scss b/src/css/_win95_common.scss
@@ -658,10 +658,19 @@ ul.toolbar {
             border-right: 1px solid $color-border-highlight;
         }
 
-        &[data-icon="show-desktop"  ]:before { background-position: (-16px * 4) (-16px * 2); }
-        &[data-icon="ie5"           ]:before { background-position: (-16px * 5) (-16px * 2); }
-        &[data-icon="outlook"       ]:before { background-position: (-16px * 6) (-16px * 2); }
-        &[data-icon="github"        ]:before { background-position: (-16px * 6) (-16px * 3); }
+        &[data-icon="show-desktop"  ]:before { background-position: (-16px *  4) (-16px * 2); }
+        &[data-icon="ie5"           ]:before { background-position: (-16px *  5) (-16px * 2); }
+        &[data-icon="outlook"       ]:before { background-position: (-16px *  6) (-16px * 2); }
+        &[data-icon="twitter"       ]:before { background-position: (-16px * 10) (-16px * 5); }
+        &[data-icon="facebook"      ]:before { background-position: (-16px * 11) (-16px * 5); }
+        &[data-icon="github"        ]:before { background-position: (-16px * 12) (-16px * 5); }
+
+        a {
+            // XXX
+            display: block;
+            width: 16px;
+            height: 16px;
+        }
     }
 }