apply JT's changes to the jumbotron

This commit is contained in:
Jason Costello 2016-10-10 19:08:13 -07:00
parent f5e5a4c7a9
commit 6c2c713a39
3 changed files with 39 additions and 33 deletions

View File

@ -34,12 +34,13 @@ body.page-home {
}
#primary-cta{
padding-bottom: 160px;
margin-top: -30px;
padding-bottom: 100px;
color: $white;
background: $black;
p.lead{
margin-bottom: 40px;
.terra-btn{
margin-top: 30px;
}
}
@ -55,10 +56,8 @@ body.page-home {
}
p {
display: inline-block;
float: left;
margin-right: 6%;
padding-top: 30px;
text-transform: uppercase;
letter-spacing: 2px;
}
#customer-logos-bg{
@ -71,48 +70,45 @@ body.page-home {
}
ul.customer-list{
display: inline;
width: 100%;
text-align: justify;
padding-left: 15px;
li{
display: inline-block;
width: 80px;
width: 16%;
height: 80px;
margin-right: 6%;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
#nike {
background: transparent image-url("customer-logos/nike.svg") center no-repeat;
background-size: 100%;
background: transparent image-url("customer-logos/nike.svg") left no-repeat;
background-size: 80px;
}
#hbo {
background: transparent image-url("customer-logos/hbo.svg") center no-repeat;
background-size: 80%;
background: transparent image-url("customer-logos/hbo.svg") left no-repeat;
background-size: 80px;
}
#target {
background: transparent image-url("customer-logos/target.svg") center no-repeat;
background-size: 60%;
background: transparent image-url("customer-logos/target.svg") left no-repeat;
background-size: 50px;
}
#capital-one {
background: transparent image-url("customer-logos/capital-one.svg") center no-repeat;
background-size: 100%;
background: transparent image-url("customer-logos/capital-one.svg") left no-repeat;
background-size: 100px;
}
#home-depot {
background: transparent image-url("customer-logos/home-depot.svg") center no-repeat;
background-size: 70%;
background: transparent image-url("customer-logos/home-depot.svg") left no-repeat;
background-size: 50px;
}
#hotels-dot-com {
background: transparent image-url("customer-logos/hotels-dot-com.svg") center no-repeat;
background-size: 100%;
background: transparent image-url("customer-logos/hotels-dot-com.svg") left no-repeat;
background-size: 100px;
}
}
@ -410,7 +406,7 @@ body.page-home {
}
}
.cta {
&.cta {
text-align: center;
.btn {

View File

@ -121,11 +121,10 @@
width:100%;
top:540px;
color:#fff;
text-align:center;
visibility:hidden;
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300;
font-weight: 500;
-webkit-transform:translate3d(0,0,0);
-moz-transform:translate3d(0,0,0);

View File

@ -2,7 +2,13 @@
<div id="jumbotron-mask">
<div id="jumbotron">
<div class="jumbotron-content" id="jumbotron-content">
<h2 class="tag-line" id="tag-line" style="visibility: hidden;">Write, plan, and create infrastructure</h2>
<div class="container">
<div class="row">
<div class="col-sm-12">
<h2 class="tag-line" id="tag-line" style="visibility: hidden;">Write, plan, and create infrastructure</h2>
</div>
</div>
</div>
</div>
</div>
</div>
@ -10,24 +16,29 @@
<div class="cta" id="primary-cta">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2">
<div class="col-md-8">
<p class="lead">Terraform is an open source tool that allows you to codify APIs into
declarative configuration files that can be shared amongst team members,
treated as code, edited, reviewed, and versioned. Safely and
predictably create, change, and improve production infrastructure.</p>
<p>
</div>
<div class="col-md-4">
<p class="center vert-container">
<a class="terra-btn" href="/intro/index.html">Get Started</a>
</p>
</div>
</div>
</div>
</div>
</div>
</div><!-- /. row -->
</div><!-- / .container -->
</div><!-- / .#primary-cta -->
<div class="skew-item" id="customer-logos">
<div class="container">
<div class="row">
<div class="col-sm-12">
<p>Trusted in production by:</p>
</div>
<div class="">
<ul class="customer-list">
<li id="nike">Nike</li>
<li id="hbo">HBO</li>