updates to index jumbotron

This commit is contained in:
davegandy 2013-05-04 19:13:40 -04:00
parent 8d5063c248
commit cd6836ecbb
6 changed files with 101 additions and 78 deletions

View file

@ -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>

View file

@ -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>

View file

@ -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;

Binary file not shown.

File diff suppressed because one or more lines are too long

View file

@ -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;