updates to index jumbotron

build/_includes/jumbotron-slider.html

@@ -1,22 +1,24 @@
-<div class="jumbotron">
+<div class="jumbotron jumbotron-index">
   <div class="container">
     <div class="row">
       <div class="span8">
         <div class="hero-content">
           <h1>Font Awesome</h1>
-          <p>The iconic font designed for<br>use with Twitter Bootstrap</p>
+          <p>The iconic font designed for Bootstrap</p>
           <div class="actions">
-            <a class="btn btn-primary btn-large" href="https://github.com/FortAwesome/Font-Awesome/zipball/master"
+            <a class="btn btn-primary btn-large" href="{{ site.font-awesome.github.url }}/zipball/master"
                onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'Download on GitHub']);">
-              <i class="icon-download icon-2x pull-left"></i>
-              Download Font<br>Awesome {{ site.font-awesome.version }}</a>
-            <a class="btn btn-large btn-github" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"
-               onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);">
-              <i class="icon-github icon-2x pull-left"></i>
-              View Project<br>on GitHub</a>
+              <i class="icon-download-alt icon-large"></i>&nbsp;&nbsp;
+              Download
+              <!--Download Font Awesome-->
+            </a>
           </div>
           <div class="shameless-self-promotion">
-            Version {{ site.font-awesome.version }} • Created & Maintained by Dave Gandy
+            <a href="{{ site.font-awesome.github.url }}" target="_blank"
+               onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);">
+              GitHub Project</a> &nbsp;&nbsp;&middot;&nbsp;&nbsp;
+            Version {{ site.font-awesome.version }} &nbsp;&nbsp;&middot;&nbsp;&nbsp;
+            Created &amp; Maintained by Dave Gandy
           </div>
         </div>
       </div>
@@ -44,10 +46,10 @@
           <!-- Carousel nav -->
           <a class="carousel-control left" href="#iconCarousel" data-slide="prev"
              onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Prev']);">
-            <i class="icon-arrow-left"></i></a>
+            <i class="icon-circle-arrow-left"></i></a>
           <a class="carousel-control right" href="#iconCarousel" data-slide="next"
              onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Next']);">
-            <i class="icon-arrow-right"></i></a>
+            <i class="icon-circle-arrow-right"></i></a>
         </div>
       </div>
     </div>

build/_layouts/base.html

@@ -11,7 +11,7 @@
   <title>{% if page.title %}{{ page.title }}{% endif %}</title>
   <meta name="description" content="Font Awesome, the iconic font designed for use with Bootstrap">
   <meta name="author" content="Dave Gandy">
-  <!--<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">-->
+  <meta name="viewport" content="initial-scale=1; maximum-scale=1">
 
   <!--[if lt IE 9]>
   <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
@@ -53,7 +53,7 @@
 </div>
 {% include footer.html %}
 
-<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+<script src="http://platform.twitter.com/widgets.js"></script>
 <script src="{{ site.baseurl }}assets/js/jquery-1.7.1.min.js"></script>
 <script src="{{ site.baseurl }}assets/js/underscore.min.js"></script>
 <script src="{{ site.baseurl }}assets/js/backbone.min.js"></script>

build/assets/css/site.css

@@ -5478,31 +5478,37 @@ h6 {
   font-family: museo-slab, "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 #iconCarousel {
-  font-size: 280px;
+  font-size: 215px;
   text-align: center;
-  line-height: 285px;
+  line-height: 220px;
   text-shadow: 2px 2px 3px #222222;
 }
 #iconCarousel a {
   color: #ffffff;
 }
 #iconCarousel .carousel-control {
-  top: 313px;
-  width: 23px;
-  height: 23px;
-  border-width: 3px;
-  font-size: 17px;
+  top: 248px;
+  width: 30px;
+  height: 30px;
+  background: none;
+  border-width: 0;
+  font-size: 30px;
   line-height: 25px;
-  left: 117px;
+  left: 115px;
 }
 #iconCarousel .carousel-control.right {
   left: auto;
-  right: 117px;
+  right: 115px;
 }
 .jumbotron {
   background: #9d261d;
   border-bottom: 1px solid #721c15;
-  padding: 48px 0;
+  background-color: #99251c;
+  background-repeat: repeat-x;
+  background-image: -moz-linear-gradient(-40deg, #9d261d, #99251c);
+  background-image: -webkit-linear-gradient(-40deg, #9d261d, #99251c);
+  background-image: -o-linear-gradient(-40deg, #9d261d, #99251c);
+  background-image: linear-gradient(-40deg, #9d261d, #99251c);
   text-shadow: 2px 2px 2px #333333;
 }
 .jumbotron,
@@ -5519,9 +5525,10 @@ h6 {
   margin-bottom: 15px;
   font-size: 30px;
   line-height: 1.3;
+  font-weight: lighter;
 }
 .jumbotron .actions {
-  margin-top: 30px;
+  margin-top: 25px;
 }
 .jumbotron ul {
   margin-left: 50px;
@@ -5538,22 +5545,39 @@ h6 {
 .jumbotron .btn-large {
   font-family: museo-slab, "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 500;
-  font-size: 18px;
-  padding: 13px 23px 13px 22px;
-  margin-right: 10px;
-  text-align: left;
+  font-size: 24px;
+  padding: 17px 30px;
+  letter-spacing: -1px;
 }
 .jumbotron .hero-content {
   text-align: center;
 }
 .jumbotron .shameless-self-promotion {
-  font-size: 12px;
-  margin-top: 15px;
-  color: #ce938e;
+  font-size: 14px;
+  margin-top: 25px;
+  color: #c47d77;
   text-shadow: none;
 }
-.jumbotron .carbonad {
-  text-shadow: none;
+.jumbotron .shameless-self-promotion a {
+  color: #e2bebb;
+}
+.jumbotron .shameless-self-promotion a:hover {
+  color: #ffffff;
+}
+.jumbotron-index {
+  padding: 40px 0;
+}
+.jumbotron-index h1 {
+  font-size: 80px;
+  letter-spacing: -2px;
+  line-height: 1;
+  margin: 0 0 15px;
+}
+.jumbotron-index p {
+  margin-top: 15px;
+  margin-bottom: 15px;
+  font-size: 30px;
+  line-height: 1.3;
 }
 .jumbotron-ad {
   padding: 20px 0;
@@ -5703,10 +5727,6 @@ section {
 #social-buttons .fork {
   margin-right: 30px;
 }
-.carbonad-horizontal {
-  width: 310px;
-  margin: 20px auto 10px;
-}
 .the-icons {
   list-style-type: none;
   margin: 0;

build/assets/less/site.less

@@ -6,8 +6,6 @@
 @import "lazy.less";
 
 .navbar .brand {
-//  padding: 11px 20px 9px;
-//  color: @white;
   font-family: @serifFontFamily;
   .icon-flag { padding-right: 3px; }
 }
@@ -20,22 +18,22 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
 
 #iconCarousel {
   a { color: @white; }
-//  border: solid 1px @white;
-  @size: 280px;
+  @size: 215px;
   font-size: @size;
   text-align: center;
   line-height: @size + 5;
   text-shadow: 2px 2px 3px @grayDarker;
   .carousel-control {
     top: @size + 33px;
-    .square(23px);
-    border-width: 3px;
-    font-size: 17px;
+    .square(30px);
+    background: none;
+    border-width: 0;
+    font-size: 30px;
     line-height: 25px;
-    left: @size / 2 - 23;
+    left: @size - 100px;
     &.right {
       left: auto;
-      right: @size / 2 - 23;
+      right: @size - 100px;
     }
   }
 }
@@ -43,10 +41,9 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
 .jumbotron {
   background: @red;
   border-bottom: 1px solid @redDark;
-  padding: 48px 0;
-//  #gradient > .radial( lighten(@red, 10%), @red);
-//  background-color: @red;
   &, h1 { color: @white; }
+  #gradient > .directional(@red, mix(@red, @redDark, 90%), -40deg);
+//  background-color: @red;
 
 //  &:after {
 //    content:'';
@@ -70,8 +67,9 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
     margin-bottom: 15px;
     font-size: 30px;
     line-height: 1.3;
+    font-weight: lighter;
   }
-  .actions { margin-top: 30px;}
+  .actions { margin-top: 25px;}
   text-shadow: 2px 2px 2px @grayDark;
   ul {
     margin-left: 50px;
@@ -85,38 +83,40 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
       text-shadow: 1px 1px 1px @grayDark;
     }
   }
-//  a { color: #fffeb8; }
   .btn-large {
-////    .buttonBackground(@white, #bbb);
     font-family: @serifFontFamily;
-////    color: @grayDark;
-//    margin-top: 15px;
     font-weight: 500;
-    font-size: 18px;
-    padding: 13px 23px 13px 22px;
-//    padding-left: 24px + 40;
-    margin-right: 10px;
-//    .border-radius(8px);
-//    position: relative;
-    text-align: left;
-//    i  {
-//      position: absolute;
-//      top: 8px;
-//      left: 15px;
-//      font-size: 46px;
-//    }
+    font-size: 24px;
+    padding: 17px 30px;
+    letter-spacing: -1px;
   }
   .hero-content {
-//    width: 620px;
     text-align: center;
   }
   .shameless-self-promotion {
-    font-size: 12px;
-    margin-top: 15px;
-    color: mix(@white, @red, 50%);
+    font-size: 14px;
+    margin-top: 25px;
+    color: mix(@white, @red, 40%);
     text-shadow: none;
+    a { color: mix(@white, @red, 70%); }
+    a:hover { color: mix(@white, @red, 100%); }
+  }
+}
+
+.jumbotron-index {
+  padding: 40px 0;
+  h1 {
+    font-size: 80px;
+    letter-spacing: -2px;
+    line-height: 1;
+    margin: 0 0 15px;
+  }
+  p {
+    margin-top: 15px;
+    margin-bottom: 15px;
+    font-size: 30px;
+    line-height: 1.3;
   }
-  .carbonad { text-shadow: none; }
 }
 
 .jumbotron-ad {
@@ -219,11 +219,6 @@ section {
   }
 }
 
-.carbonad-horizontal {
-  width: 310px;
-  margin: 20px auto 10px;
-}
-
 .the-icons {
   list-style-type: none;
   margin: 0;