feature auto css
This commit is contained in:
parent
acba07f6c6
commit
0e2b166e9f
|
@ -18,63 +18,36 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="features">
|
<div class="feature" id="feature-auto">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row double-row">
|
<div class="row">
|
||||||
<div class="col-lg-6 col-md-6">
|
<div class="col-lg-6 col-md-6">
|
||||||
<div class="row">
|
<h2 class="feature-t">Automatically build infrastructure from code</h2>
|
||||||
<div class="col-lg-5 col-md-5">
|
|
||||||
<span class="icn discovery"></span>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-7 col-md-7">
|
|
||||||
<h2>Service Discovery</h2>
|
|
||||||
<p>
|
|
||||||
Terraform makes it simple for services to register themselves
|
|
||||||
and to discover other services via a DNS or HTTP interface.
|
|
||||||
Register external services such as SaaS providers as well.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-6 col-md-6">
|
<div class="col-lg-6 col-md-6">
|
||||||
<div class="row">
|
<h3 class="terminal-text">$ terraform apply</h3>
|
||||||
<div class="col-lg-5 col-md-5">
|
</div>
|
||||||
<span class="icn health"></span>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-7 col-md-7">
|
|
||||||
<h2>Failure Detection</h2>
|
|
||||||
<p>Pairing service discovery with health checking prevents routing requests to unhealthy hosts and enables services to easily provide circuit breakers.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row double-row">
|
|
||||||
<div class="col-lg-6 col-md-6">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-5">
|
|
||||||
<span class="icn multi"></span>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-7 col-md-7">
|
|
||||||
<h2>Multi Datacenter</h2>
|
|
||||||
<p>Terraform scales to multiple datacenters out of the box with no complicated configuration. Look up services in other datacenters, or keep the request local.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-6 col-md-6">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-5 col-md-5">
|
|
||||||
<span class="icn config"></span>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-7 col-md-7">
|
|
||||||
<h2>Key/Value Storage</h2>
|
|
||||||
<p>Flexible key/value store for dynamic configuration, feature flagging, coordination, leader election and more. Long poll for near-instant notification of configuration changes.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div> <!-- /container -->
|
</div> <!-- /container -->
|
||||||
</div> <!-- /features -->
|
</div> <!-- /feature -->
|
||||||
|
|
||||||
|
<div class="feature" id="feature-iterate">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-lg-6 col-md-6">
|
||||||
|
<div class="f-icon">
|
||||||
|
<div class="t-block"></div>
|
||||||
|
<div class="t-block"></div>
|
||||||
|
<div class="t-block"></div>
|
||||||
|
<div class="t-block"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-6 col-md-6">
|
||||||
|
<h3 class="feature-t">Iterate on infrastructure safely</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div> <!-- /container -->
|
||||||
|
</div> <!-- /feature -->
|
||||||
|
|
||||||
<div id="demos">
|
<div id="demos">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
|
@ -8,8 +8,10 @@
|
||||||
}*/
|
}*/
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-size: 15px;
|
|
||||||
color: @black;
|
color: @black;
|
||||||
|
background-color: @black;
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: @font-family-lato;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -45,8 +45,6 @@ body.page-sub{
|
||||||
line-height: 56px;
|
line-height: 56px;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
.lato-light();
|
.lato-light();
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
||||||
.img-retina("../images/header-logo.png", "../images/header-logo@2x.png", 50px, 56px);
|
.img-retina("../images/header-logo.png", "../images/header-logo@2x.png", 50px, 56px);
|
||||||
|
|
|
@ -1,58 +1,24 @@
|
||||||
//
|
//
|
||||||
// Home
|
// Home
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
body.page-home{
|
/*body.page-home{
|
||||||
background-color: #f8f8f8;
|
background-color: #f8f8f8;
|
||||||
}
|
}*/
|
||||||
|
|
||||||
#features{
|
.feature{
|
||||||
.anti-alias();
|
h2{
|
||||||
padding: 130px 0 0 0;
|
text-align: right;
|
||||||
//background: #f8f8f8 url(../images/hero-dots-below@2x.png) center top no-repeat;
|
font-size: 44px;
|
||||||
background: #f8f8f8;
|
line-height: 54px;
|
||||||
background-size: 1280px 49px;
|
|
||||||
|
|
||||||
-webkit-transform: skewY(-5deg);
|
|
||||||
-moz-transform: skewY(-5deg);
|
|
||||||
-ms-transform: skewY(-5deg);
|
|
||||||
-o-transform: skewY(-5deg);
|
|
||||||
transform: skewY(-5deg);
|
|
||||||
|
|
||||||
/*transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-webkit-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-moz-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-o-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-ms-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);*/
|
|
||||||
|
|
||||||
>.container{
|
|
||||||
-webkit-transform: skewY(5deg);
|
|
||||||
-moz-transform: skewY(5deg);
|
|
||||||
-ms-transform: skewY(5deg);
|
|
||||||
-o-transform: skewY(5deg);
|
|
||||||
transform: skewY(5deg);
|
|
||||||
|
|
||||||
/*transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-webkit-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-moz-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-o-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-ms-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);*/
|
|
||||||
}
|
|
||||||
|
|
||||||
.double-row{
|
|
||||||
padding: 0 0 50px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2{
|
|
||||||
font-size: 24px;
|
|
||||||
letter-spacing: 2px;
|
letter-spacing: 2px;
|
||||||
color: @purple;
|
color: @purple;
|
||||||
font-family: @font-family-lato;
|
.lato-light()
|
||||||
font-weight: @font-weight-lato-xb;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
p{
|
p{
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
color: @consul-gray;
|
color: @consul-gray;
|
||||||
font-family: @font-family-lato;
|
font-family: @font-family-lato;
|
||||||
font-weight: @font-weight-lato-sb;
|
font-weight: @font-weight-lato-sb;
|
||||||
|
@ -66,92 +32,42 @@ body.page-home{
|
||||||
background-position: center 0;
|
background-position: center 0;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
|
|
||||||
.discovery{
|
|
||||||
background-image: url( ../images/feature-discovery@2x.png);
|
|
||||||
background-size: 181px 181px;
|
|
||||||
}
|
|
||||||
.health{
|
|
||||||
background-image: url( ../images/feature-health@2x.png);
|
|
||||||
background-size: 125px 179px;
|
|
||||||
}
|
|
||||||
.multi{
|
|
||||||
background-image: url( ../images/feature-multi@2x.png);
|
|
||||||
background-size: 182px 184px;
|
|
||||||
}
|
|
||||||
.config{
|
|
||||||
background-image: url( ../images/feature-config@2x.png);
|
|
||||||
background-size: 157px 179px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#trusted{
|
#feature-auto{
|
||||||
background-color: @black;
|
.anti-alias();
|
||||||
padding: 140px 0;
|
margin-top: -36px;
|
||||||
|
padding: 200px 0;
|
||||||
|
background: #f8f8f8 url(../images/white-wireframe.png) center top no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
|
||||||
h3{
|
-webkit-transform: skewY(-2deg);
|
||||||
margin-bottom: 60px;
|
-moz-transform: skewY(-2deg);
|
||||||
color: @white;
|
-ms-transform: skewY(-2deg);
|
||||||
text-transform: uppercase;
|
-o-transform: skewY(-2deg);
|
||||||
font-size: 18px;
|
transform: skewY(-2deg);
|
||||||
|
|
||||||
|
>.container{
|
||||||
|
-webkit-transform: skewY(2deg);
|
||||||
|
-moz-transform: skewY(2deg);
|
||||||
|
-ms-transform: skewY(2deg);
|
||||||
|
-o-transform: skewY(2deg);
|
||||||
|
transform: skewY(2deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-text{
|
||||||
|
color: black;
|
||||||
|
line-height: 88px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
font-size: 35px;
|
||||||
|
font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
|
||||||
.trusted-items{
|
.opt-text();
|
||||||
width: 800px;
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
padding: 0;
|
|
||||||
> li{
|
|
||||||
display: inline-block;
|
|
||||||
float: left;
|
|
||||||
width: 25%;
|
|
||||||
height: 80px;
|
|
||||||
margin: 12px 0;
|
|
||||||
background: url( ../images/trusted-sprite.png ) 0 0 no-repeat;
|
|
||||||
|
|
||||||
&#i0{
|
|
||||||
background-position: 0 0;
|
|
||||||
}
|
|
||||||
&#i1{
|
|
||||||
background-position: 0 -80px;
|
|
||||||
}
|
|
||||||
&#i2{
|
|
||||||
background-position: 0 -160px;
|
|
||||||
}
|
|
||||||
&#i3{
|
|
||||||
background-position: 0 -240px;
|
|
||||||
}
|
|
||||||
&#i4{
|
|
||||||
background-position: 0 -320px;
|
|
||||||
}
|
|
||||||
&#i5{
|
|
||||||
background-position: 0 -400px;
|
|
||||||
}
|
|
||||||
&#i6{
|
|
||||||
background-position: 0 -480px;
|
|
||||||
}
|
|
||||||
&#i7{
|
|
||||||
background-position: 0 -560px;
|
|
||||||
}
|
|
||||||
&#i8{
|
|
||||||
background-position: 0 -640px;
|
|
||||||
}
|
|
||||||
&#i9{
|
|
||||||
background-position: 0 -720px;
|
|
||||||
}
|
|
||||||
&#i10{
|
|
||||||
background-position: 0 -800px;
|
|
||||||
}
|
|
||||||
&#i11{
|
|
||||||
background-position: 0 -880px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#feature-iterate{
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
#footer{
|
#footer{
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: @jumbotron-total-height;
|
height: @jumbotron-total-height;
|
||||||
margin-top: @negative-hero-margin;
|
margin-top: @negative-hero-margin;
|
||||||
|
background-color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
#jumbotron {
|
#jumbotron {
|
||||||
|
@ -31,6 +32,10 @@
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin-top: @header-height;
|
margin-top: @header-height;
|
||||||
|
|
||||||
|
> div{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.jumbo-logo-wrap{
|
.jumbo-logo-wrap{
|
||||||
margin-top: 135px;
|
margin-top: 135px;
|
||||||
|
|
||||||
|
|
|
@ -26,4 +26,9 @@
|
||||||
.lato-light(){
|
.lato-light(){
|
||||||
font-family: @font-family-lato;
|
font-family: @font-family-lato;
|
||||||
font-weight: 100;
|
font-weight: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.opt-text(){
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
}
|
|
@ -28,7 +28,7 @@
|
||||||
@tan: #f0f0e5;
|
@tan: #f0f0e5;
|
||||||
@consul-gray: #909090;
|
@consul-gray: #909090;
|
||||||
@consul-footer-gray: #d7d4d7;
|
@consul-footer-gray: #d7d4d7;
|
||||||
@purple: #69499a;
|
@purple: #822ff7;
|
||||||
@light-purple: #f7f3f9;
|
@light-purple: #f7f3f9;
|
||||||
@btn-color: #4592C5;
|
@btn-color: #4592C5;
|
||||||
|
|
||||||
|
|
|
@ -19,8 +19,10 @@
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
}*/
|
}*/
|
||||||
body {
|
body {
|
||||||
font-size: 15px;
|
|
||||||
color: #242424;
|
color: #242424;
|
||||||
|
background-color: #242424;
|
||||||
|
font-size: 15px;
|
||||||
|
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
}
|
}
|
||||||
h1 {
|
h1 {
|
||||||
|
@ -132,8 +134,6 @@ body.page-sub #header {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
font-weight: 100;
|
font-weight: 100;
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
background: url(../images/consul-header-logo.png) 0 0 no-repeat;
|
||||||
background-image: url("../images/header-logo.png");
|
background-image: url("../images/header-logo.png");
|
||||||
|
@ -247,7 +247,7 @@ body.page-sub #header {
|
||||||
#footer {
|
#footer {
|
||||||
height: 650px;
|
height: 650px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
}
|
}
|
||||||
#footer .main-links.navbar-nav {
|
#footer .main-links.navbar-nav {
|
||||||
float: none;
|
float: none;
|
||||||
|
@ -255,13 +255,13 @@ body.page-sub #header {
|
||||||
padding-top: 155px;
|
padding-top: 155px;
|
||||||
}
|
}
|
||||||
#footer .main-links.navbar-nav .li-under a::after {
|
#footer .main-links.navbar-nav .li-under a::after {
|
||||||
background-color: #69499a;
|
background-color: #822ff7;
|
||||||
}
|
}
|
||||||
#footer .footer-hashi {
|
#footer .footer-hashi {
|
||||||
padding-top: 110px;
|
padding-top: 110px;
|
||||||
}
|
}
|
||||||
#footer a {
|
#footer a {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
}
|
}
|
||||||
#footer .buttons.navbar-nav {
|
#footer .buttons.navbar-nav {
|
||||||
float: none;
|
float: none;
|
||||||
|
@ -423,6 +423,7 @@ body.page-sub #header {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 804px;
|
height: 804px;
|
||||||
margin-top: -90px;
|
margin-top: -90px;
|
||||||
|
background-color: black;
|
||||||
}
|
}
|
||||||
#jumbotron {
|
#jumbotron {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -444,6 +445,9 @@ body.page-sub #header {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin-top: 90px;
|
margin-top: 90px;
|
||||||
}
|
}
|
||||||
|
#jumbotron .container > div {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
#jumbotron .container .jumbo-logo-wrap {
|
#jumbotron .container .jumbo-logo-wrap {
|
||||||
margin-top: 135px;
|
margin-top: 135px;
|
||||||
}
|
}
|
||||||
|
@ -483,8 +487,8 @@ body.page-sub #header {
|
||||||
transition: background-color 0.3s ease-in-out;
|
transition: background-color 0.3s ease-in-out;
|
||||||
}
|
}
|
||||||
.outline-btn.purple {
|
.outline-btn.purple {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
border: 2px solid #69499a;
|
border: 2px solid #822ff7;
|
||||||
}
|
}
|
||||||
.outline-btn:hover {
|
.outline-btn:hover {
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
@ -521,49 +525,19 @@ body.page-sub #header {
|
||||||
-moz-transform: translateY(0px);
|
-moz-transform: translateY(0px);
|
||||||
transform: translateY(0px);
|
transform: translateY(0px);
|
||||||
}
|
}
|
||||||
body.page-home {
|
/*body.page-home{
|
||||||
background-color: #f8f8f8;
|
background-color: #f8f8f8;
|
||||||
}
|
}*/
|
||||||
#features {
|
.feature h2 {
|
||||||
text-rendering: optimizeLegibility;
|
text-align: right;
|
||||||
-webkit-font-smoothing: antialiased;
|
font-size: 44px;
|
||||||
padding: 130px 0 0 0;
|
line-height: 54px;
|
||||||
background: #f8f8f8;
|
|
||||||
background-size: 1280px 49px;
|
|
||||||
-webkit-transform: skewY(-5deg);
|
|
||||||
-moz-transform: skewY(-5deg);
|
|
||||||
-ms-transform: skewY(-5deg);
|
|
||||||
-o-transform: skewY(-5deg);
|
|
||||||
transform: skewY(-5deg);
|
|
||||||
/*transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-webkit-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-moz-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-o-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);
|
|
||||||
-ms-transform: rotate(358deg) scale(1) skew(-2deg) translate(0px);*/
|
|
||||||
}
|
|
||||||
#features > .container {
|
|
||||||
-webkit-transform: skewY(5deg);
|
|
||||||
-moz-transform: skewY(5deg);
|
|
||||||
-ms-transform: skewY(5deg);
|
|
||||||
-o-transform: skewY(5deg);
|
|
||||||
transform: skewY(5deg);
|
|
||||||
/*transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-webkit-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-moz-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-o-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);
|
|
||||||
-ms-transform: rotate(2deg) scale(1) skew(3deg) translate(0px);*/
|
|
||||||
}
|
|
||||||
#features .double-row {
|
|
||||||
padding: 0 0 50px 0;
|
|
||||||
}
|
|
||||||
#features h2 {
|
|
||||||
font-size: 24px;
|
|
||||||
letter-spacing: 2px;
|
letter-spacing: 2px;
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
font-weight: 700;
|
font-weight: 100;
|
||||||
}
|
}
|
||||||
#features p {
|
.feature p {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
line-height: 1.5em;
|
line-height: 1.5em;
|
||||||
|
@ -571,7 +545,7 @@ body.page-home {
|
||||||
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
font-family: 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
#features .icn {
|
.feature .icn {
|
||||||
display: block;
|
display: block;
|
||||||
width: 186px;
|
width: 186px;
|
||||||
height: 272px;
|
height: 272px;
|
||||||
|
@ -579,83 +553,34 @@ body.page-home {
|
||||||
background-position: center 0;
|
background-position: center 0;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
}
|
}
|
||||||
#features .discovery {
|
#feature-auto {
|
||||||
background-image: url(../images/feature-discovery@2x.png);
|
text-rendering: optimizeLegibility;
|
||||||
background-size: 181px 181px;
|
-webkit-font-smoothing: antialiased;
|
||||||
|
margin-top: -36px;
|
||||||
|
padding: 200px 0;
|
||||||
|
background: #f8f8f8 url(../images/white-wireframe.png) center top no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
-webkit-transform: skewY(-2deg);
|
||||||
|
-moz-transform: skewY(-2deg);
|
||||||
|
-ms-transform: skewY(-2deg);
|
||||||
|
-o-transform: skewY(-2deg);
|
||||||
|
transform: skewY(-2deg);
|
||||||
}
|
}
|
||||||
#features .health {
|
#feature-auto > .container {
|
||||||
background-image: url(../images/feature-health@2x.png);
|
-webkit-transform: skewY(2deg);
|
||||||
background-size: 125px 179px;
|
-moz-transform: skewY(2deg);
|
||||||
|
-ms-transform: skewY(2deg);
|
||||||
|
-o-transform: skewY(2deg);
|
||||||
|
transform: skewY(2deg);
|
||||||
}
|
}
|
||||||
#features .multi {
|
#feature-auto .terminal-text {
|
||||||
background-image: url(../images/feature-multi@2x.png);
|
color: black;
|
||||||
background-size: 182px 184px;
|
line-height: 88px;
|
||||||
}
|
|
||||||
#features .config {
|
|
||||||
background-image: url(../images/feature-config@2x.png);
|
|
||||||
background-size: 157px 179px;
|
|
||||||
}
|
|
||||||
#trusted {
|
|
||||||
background-color: #242424;
|
|
||||||
padding: 140px 0;
|
|
||||||
}
|
|
||||||
#trusted h3 {
|
|
||||||
margin-bottom: 60px;
|
|
||||||
color: #ffffff;
|
|
||||||
text-transform: uppercase;
|
|
||||||
font-size: 18px;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
font-size: 35px;
|
||||||
#trusted .trusted-items {
|
font-family: "Courier New", Monaco, Menlo, Consolas, monospace;
|
||||||
width: 800px;
|
text-rendering: optimizeLegibility;
|
||||||
margin: 0 auto;
|
-webkit-font-smoothing: antialiased;
|
||||||
}
|
|
||||||
#trusted .trusted-items ul {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li {
|
|
||||||
display: inline-block;
|
|
||||||
float: left;
|
|
||||||
width: 25%;
|
|
||||||
height: 80px;
|
|
||||||
margin: 12px 0;
|
|
||||||
background: url(../images/trusted-sprite.png ) 0 0 no-repeat;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i0 {
|
|
||||||
background-position: 0 0;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i1 {
|
|
||||||
background-position: 0 -80px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i2 {
|
|
||||||
background-position: 0 -160px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i3 {
|
|
||||||
background-position: 0 -240px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i4 {
|
|
||||||
background-position: 0 -320px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i5 {
|
|
||||||
background-position: 0 -400px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i6 {
|
|
||||||
background-position: 0 -480px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i7 {
|
|
||||||
background-position: 0 -560px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i8 {
|
|
||||||
background-position: 0 -640px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i9 {
|
|
||||||
background-position: 0 -720px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i10 {
|
|
||||||
background-position: 0 -800px;
|
|
||||||
}
|
|
||||||
#trusted .trusted-items ul > li#i11 {
|
|
||||||
background-position: 0 -880px;
|
|
||||||
}
|
}
|
||||||
#footer {
|
#footer {
|
||||||
background-color: #d7d4d7;
|
background-color: #d7d4d7;
|
||||||
|
@ -732,7 +657,7 @@ body.page-home {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
letter-spacing: 3px;
|
letter-spacing: 3px;
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
}
|
}
|
||||||
#cta a:hover {
|
#cta a:hover {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -831,7 +756,7 @@ body.page-home {
|
||||||
}
|
}
|
||||||
#demos .terminals .terminal-item .terminal .terminal-window .txt-p {
|
#demos .terminals .terminal-item .terminal .terminal-window .txt-p {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #9073bd;
|
color: #ae79fa;
|
||||||
}
|
}
|
||||||
#demos .terminals .terminal-item .terminal .terminal-window p {
|
#demos .terminals .terminal-item .terminal .terminal-window p {
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
|
@ -912,7 +837,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
.docs-sidebar a {
|
.docs-sidebar a {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
}
|
}
|
||||||
.docs-sidebar .docs-sidenav {
|
.docs-sidebar .docs-sidenav {
|
||||||
padding-top: 15px;
|
padding-top: 15px;
|
||||||
|
@ -925,7 +850,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
.docs-sidebar .docs-sidenav li > a {
|
.docs-sidebar .docs-sidenav li > a {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
-webkit-transition: color 0.5s ease;
|
-webkit-transition: color 0.5s ease;
|
||||||
transition: color 0.5s ease;
|
transition: color 0.5s ease;
|
||||||
}
|
}
|
||||||
|
@ -955,7 +880,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 8px;
|
width: 8px;
|
||||||
height: 8px;
|
height: 8px;
|
||||||
background-color: #69499a;
|
background-color: #822ff7;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
top: 26px;
|
top: 26px;
|
||||||
left: -10px;
|
left: -10px;
|
||||||
|
@ -1012,7 +937,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
|
||||||
margin: 0 0 18px;
|
margin: 0 0 18px;
|
||||||
}
|
}
|
||||||
.bs-docs-section a {
|
.bs-docs-section a {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
}
|
}
|
||||||
.bs-docs-section a:hover {
|
.bs-docs-section a:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
|
@ -1023,7 +948,7 @@ body.layout-intro > .container .col-md-8[role=main] > div {
|
||||||
margin-bottom: 25px;
|
margin-bottom: 25px;
|
||||||
}
|
}
|
||||||
.bs-docs-section h1 {
|
.bs-docs-section h1 {
|
||||||
color: #69499a;
|
color: #822ff7;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
padding-bottom: 24px;
|
padding-bottom: 24px;
|
||||||
margin-top: 40px;
|
margin-top: 40px;
|
||||||
|
|
Loading…
Reference in New Issue