Merge pull request #541 from passy/gittip

Add Gittip button to the top

index.html

@@ -27,6 +27,10 @@
 				<nav>
 					<a href="https://github.com/addyosmani/todomvc/zipball/1.1.0" class="zocial red">Download (1.1)</a>
 					<a href="https://github.com/addyosmani/todomvc" class="zocial red">View project on GitHub</a>
+					<a href="https://www.gittip.com/tastejs/" class="zocial ltgray">
+						We receive <strong>$<var class="gittip-amount">0.00</var> / wk</strong>
+						on <strong>Gittip</strong>
+					</a>
 				</nav>
 			</div>
 			<div class="span4">

site/css/main.css

@@ -36,7 +36,7 @@ h2 {
 
 a {
 	color: #B83F45;
-	font-weight:bold;
+	font-weight: bold;
 }
 
 a:hover {
@@ -54,6 +54,10 @@ hr {
 	border-bottom: 1px dashed #F7F7F7;
 }
 
+var {
+	font-style: normal;
+}
+
 header p {
 	font-size: 30px;
 	line-height: 1.2;
@@ -64,7 +68,7 @@ header nav {
 	margin-top: 20px;
 }
 
-header nav a:first-child {
+header nav a:not(:last-child) {
 	margin-right: 5px;
 	margin-bottom: 5px;
 }
@@ -306,6 +310,15 @@ p .label {
 	background-color: rgba(0, 0, 0, .5);
 }
 
+.zocial.ltgray {
+	color: inherit;
+	text-shadow: none;
+}
+
+.zocial.ltgray strong {
+	color: #B83F45;
+}
+
 .zocial.small {
 	font-size: 12px;
 	padding: 2px 10px;

site/js/main.js

@@ -2,6 +2,13 @@
 (function () {
 	'use strict';
 
+	$.fn.gittip = function (username) {
+		var $this = $(this);
+		$.getJSON('https://www.gittip.com/' + username + '/public.json', function (response) {
+			$this.text(response.receiving);
+		});
+	};
+
 	$.fn.persistantPopover = function () {
 		var popoverTimeout;
 
@@ -144,6 +151,8 @@
 	// Apps popover
 	$('.applist a').persistantPopover();
 
+	$('.gittip-amount').gittip('tastejs');
+
 	// Quotes
 	$('.quotes').quote([{
 		quote: 'TodoMVC is a godsend for helping developers find what well-developed frameworks match their mental model of application architecture.',