Add links to Gittip

assets/javascripts/templates/pages/root_tmpl.coffee.erb

@@ -1,6 +1,7 @@
 app.templates.splash = """
   <div class="_splash-title">DevDocs</div>
   <a href="http://www.maxcdn.com" class="_splash-maxcdn">Sponsored by<span class="_maxcdn-logo-bw"> MaxCDN</span></a>
+  <a href="https://www.gittip.com/Thibaut/" class="_splash-gittip">Donate on<span class="_gittip-logo-bw"> Gittip</span></a>
 """
 
 <% if App.development? %>
@@ -21,6 +22,7 @@ app.templates.intro = """
       <li>DevDocs is licensed under the terms of the Mozilla Public License v2.0. For more information,
           see the <a href="https://github.com/Thibaut/devdocs/blob/master/COPYRIGHT">COPYRIGHT</a> and
           <a href="https://github.com/Thibaut/devdocs/blob/master/LICENSE">LICENSE</a> files.
+      <li>If you like the app, please consider funding the project on <a href="https://www.gittip.com/Thibaut/">Gittip</a>. Thanks!
     </ol>
     <a href="http://www.maxcdn.com" class="_intro-maxcdn">Sponsored by<span class="_maxcdn-logo"> MaxCDN</span></a>
     <p>That's all. Happy coding!
@@ -43,6 +45,7 @@ app.templates.intro = """
       <li>For the latest news, subscribe to the <a href="http://eepurl.com/HnLUz">newsletter</a> or follow <a href="https://twitter.com/DevDocs">@DevDocs</a>
       <li>DevDocs is free and <a href="https://github.com/Thibaut/devdocs">open source</a>
           <iframe class="_github-btn" src="http://ghbtns.com/github-btn.html?user=Thibaut&repo=devdocs&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100" height="20"></iframe>
+      <li>If you like the app, please consider funding the project on <a href="https://www.gittip.com/Thibaut/">Gittip</a>. Thanks!
     </ol>
     <a href="http://www.maxcdn.com" class="_intro-maxcdn">Sponsored by<span class="_maxcdn-logo"> MaxCDN</span></a>
     <p>That's all. Happy coding!

assets/stylesheets/components/_content.scss

@@ -53,21 +53,31 @@
   @extend ._booting:before, %user-select-none;
 }
 
-._splash-maxcdn {
+%splash-promo {
   position: absolute;
   bottom: 1.25rem;
-  left: 50%;
-  width: 16rem;
-  margin-left: -8rem;
   line-height: 1rem;
   color: #bbb;
-  text-align: center;
 
   &:hover { color: $linkColor; }
+}
+
+._splash-maxcdn {
+  left: .75rem;
+  @extend %splash-promo;
+
   > ._maxcdn-logo-bw { opacity: .2; }
   &:hover > ._maxcdn-logo-bw { opacity: .5; }
 }
 
+._splash-gittip {
+  right: 1.25rem;
+  @extend %splash-promo;
+
+  > ._gittip-logo-bw { opacity: .35; }
+  &:hover > ._gittip-logo-bw { opacity: .65; }
+}
+
 //
 // Intro
 //
@@ -298,7 +308,7 @@
   display: inline-block;
   vertical-align: top;
   width: 6.25rem;
-  margin-left: .375rem;
+  margin-left: .5rem;
   overflow: hidden;
   text-indent: -20rem;
   background-position: center center;
@@ -323,3 +333,15 @@
     background-image: image-url('maxcdn-bw@2x.png');
   }
 }
+
+._gittip-logo-bw {
+  width: 4.375rem;
+  margin-left: .375rem;
+  background-size: 4.375rem 1rem;
+  background-image: image-url('gittip-bw.png');
+  @extend %maxcdn-logo;
+
+  @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
+    background-image: image-url('gittip-bw@2x.png');
+  }
+}

assets/stylesheets/components/_mobile.scss

@@ -131,7 +131,13 @@
 
   // Splash
 
-  ._splash-title { margin-top: -.5em; }
+  ._splash-maxcdn, ._splash-gittip {
+    left: 0;
+    right: 0;
+    text-align: center;
+  }
+
+  ._splash-gittip { margin-bottom: 2.25rem; }
 }
 
 //

views/manifest.erb

@@ -10,6 +10,8 @@ CACHE:
 <%= image_path 'maxcdn@2x.png' %>
 <%= image_path 'maxcdn-bw.png' %>
 <%= image_path 'maxcdn-bw@2x.png' %>
+<%= image_path 'gittip-bw.png' %>
+<%= image_path 'gittip-bw@2x.png' %>
 <%= asset_path 'docs.js' %>
 <%= doc_index_urls.join "\n" %>