Adds Runscope sponsorship banner (#54)

* Adds Runscope sponsorship banner

contents/index.md

@@ -6,5 +6,3 @@ layout: index.jade
 # HTTP Status Codes
 
 httpstatuses.com is an easy to reference database of HTTP Status Codes with their definitions and helpful code references all in one place. Visit an individual status code via `httpstatuses.com/code` or browse the list below.
-
-Hosting sponsored by [Runscope](https://www.runscope.com/t/httpstatuses), source code available on [GitHub](https://github.com/citricsquid/httpstatuses).

contents/style.scss

@@ -54,6 +54,7 @@ h1, h2, h3, h4, h5, h6 {
   font-size: 20px;
   font-weight: bold;
   margin-bottom: 8px;
+  letter-spacing: 0.5px;
 }
 
 p {
@@ -71,6 +72,21 @@ code {
   padding: 25px 0px 10px 0px;
 }
 
+.banner {
+  @extend .u-full-width;
+  padding: 14px 0px;
+  border-bottom: 1px solid #eee;
+
+  p {
+    margin-bottom: 0px;
+  }
+
+  a {
+    color: #1b70e0;
+    font-weight: bold;
+  }
+}
+
 .codes {
   margin-bottom: 40px;
 
@@ -85,7 +101,6 @@ code {
       font-family: 'Open Sans', sans-serif;
       font-size: 14px;
       font-weight: bold;
-      letter-spacing: 0.5px;
       margin-bottom: 6px;
     }
 
@@ -120,7 +135,6 @@ code {
 
   h1 {
     font-family: 'Source Code Pro';
-    letter-spacing: 0.5px;
     text-transform: uppercase;
 
     span {
@@ -135,7 +149,6 @@ code {
   h2 {
     color: #bbb;
     font-family: 'Source Code Pro';
-    letter-spacing: 0.5px;
     text-transform: uppercase;
   }
 

templates/index.jade

@@ -1,7 +1,13 @@
 extends layout.jade
 
+block banner
+  .banner: .container: .row: .twelve.columns
+    p Sponsored by #[a(href='https://www.runscope.com/t/httpstatuses') Runscope — API Monitoring & Testing]
+
 block contents
-  .hero.introduction: .container: .row: .twelve.columns !{contents}
+  block banner
+  .hero.introduction: .container: .row: .twelve.columns
+    != contents
 
   .container.codes: .row: .twelve.columns
     each group in groups.codes