Adding Contributors to About page. Fixed #120

Author: Tony Guntharp

app/assets/stylesheets/_base.sass

@@ -123,3 +123,49 @@ body
     margin-left: auto
     margin-right: auto
     width: 600px  
+
+#contributors 
+  margin-left: auto
+  margin-right: auto
+  width: 600px
+  overflow: auto
+  margin-bottom: 3em
+
+#contributors 
+  li, 
+    list-style-type: none
+    width: 180px
+    margin-right: 12px
+    margin-bottom: 12px
+    overflow: auto
+    float: left
+    padding: 1px 0px
+
+#contributors 
+  li, a, 
+    display: block
+    text-decoration: none
+    overflow: auto
+
+#contributors 
+  li, span, 
+    display: block
+    float: left
+    margin-left: 12px
+    font-size: 15px
+    color: #aaa
+
+#contributors 
+  li, a, span, 
+    font-size: 15px
+    margin-top: 7px
+
+#contributors 
+  li, img, 
+    float: left
+    -webkit-border-radius: 3px
+    -moz-border-radius: 3px
+    border-radius: 3px
+    margin-right: 12px
+
+

app/views/pages/about.html.erb

@@ -1,4 +1,3 @@
-
   <title>About Kandan</title>
 
 <div class="about">
@@ -58,6 +57,21 @@
 	<li><a href="http://kandan-demo.kandanapp.com/">Kandan Demo</a> (Yes we eat our own DogFood)</li>
 	</ul>
 
+	<h3>Contributors</h3>
+    <div id="contributors"></div>
+    <script>
+  $.getJSON('contributors.json', function(data) {
+        var output="<ul>";
+        for (var i in data.contributors) {
+        	output+="";
+            output+="<span><li><img src='https://secure.gravatar.com/avatar/"+ data.contributors[i].gravatar_id+"' height='30' width='30'> <a href='"+ data.contributors[i].html_url+ "'>"+ data.contributors[i].login + "</a></li></span>";
+        }
+
+        output+="</ul></div>";
+        document.getElementById("contributors").innerHTML=output;
+  });
+    </script>
+
 	<h3>Contact Us</h3>
 	<p>If you find any security issues please submit an <a href="https://github.com/kandanapp/kandan/issues">Issue</a> or <a href="mailto:admin@kandanapp.com">email us</a>.</p>
 	<br><br>