ResiLien
/
terraform
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

skew sections

This commit is contained in:
Jason Costello 2016-10-07 12:06:42 -07:00
parent 75dfdc43f8
commit 8b91a903f3
1 changed files with 27 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
website/source/assets/stylesheets/_home.scss
View File

@ -51,19 +51,19 @@ body.page-home {
color: $white; color: $white;
>.container { >.container {
z-index: 21; z-index: 91;
} }
p { p {
display: inline-block; display: inline-block;
float: left; float: left;
margin-right: 6%; margin-right: 6%;
padding-top: 20px; padding-top: 30px;
} }
#customer-logos-bg{ #customer-logos-bg{
@include skewY(-3deg); @include skewY(-3deg);
z-index: 20; z-index: 30;
background: $black; background: $black;
background-size: 100%; background-size: 100%;
} }
@ -156,8 +156,10 @@ body.page-home {
} }
#feature-overview{ #feature-overview{
position: relative;
padding: 120px 0; padding: 120px 0;
border-bottom: 2px solid #E6E7E8; border-bottom: 2px solid #E6E7E8;
z-index: 80;
} }
.feature-card { .feature-card {
@ -202,16 +204,18 @@ body.page-home {
padding: 180px 0 200px; padding: 180px 0 200px;
margin-top: -80px; margin-top: -80px;
>.container { >.container {
z-index: 21; z-index: 71;
} }
#feature-write-bg{ #feature-write-bg{
border-top: 2px solid white; border-top: 2px solid white;
border-bottom: 2px solid $purple; border-bottom: 2px solid $purple;
background: image-url("feature-write-bg.svg") 85% 100% no-repeat; background: $white image-url("feature-write-bg.svg") 85% bottom no-repeat;
background-size: 570px; background-size: 570px;
z-index: 20; z-index: 70;
@include skewY(3deg);
} }
} }
@ -220,11 +224,11 @@ body.page-home {
color: $white; color: $white;
background-size: 80%; background-size: 80%;
position: relative; position: relative;
padding: 180px 0 180px; padding: 220px 0 180px;
margin-top: -80px; margin-top: -80px;
>.container { >.container {
z-index: 21; z-index: 61;
background: image-url("feature-plan-bg.svg") 0% 45% no-repeat; background: image-url("feature-plan-bg.svg") 0% 45% no-repeat;
background-size: 100%; background-size: 100%;
} }
@ -237,20 +241,20 @@ body.page-home {
background: $purple; background: $purple;
border-top: 2px solid white; border-top: 2px solid white;
border-bottom: 2px solid $purple; border-bottom: 2px solid $purple;
z-index: 20; z-index: 60;
@include skewY(3deg); @include skewY(-3deg);
} }
} }
#feature-create{ #feature-create{
position: relative; position: relative;
margin-top: -80px; margin-top: -80px;
padding: 240px 0 300px; padding: 240px 0 180px;
>.container{ >.container{
background: image-url("feature-create-bg.svg") 95% 20% no-repeat; background: image-url("feature-create-bg.svg") 95% 20% no-repeat;
background-size: 40%; background-size: 40%;
z-index: 21; z-index: 51;
} }
p.lead { p.lead {
@ -259,24 +263,24 @@ body.page-home {
#feature-create-bg{ #feature-create-bg{
@include skewY(3deg); @include skewY(3deg);
z-index: 20; z-index: 50;
} }
} }
#demos{ #demos{
position: relative; position: relative;
padding: 180px 0 60px; padding: 120px 0 60px;
margin-top: -80px; margin-top: -80px;
>.container{ >.container{
z-index: 31; z-index: 41;
} }
#demo-bg{ #demo-bg{
background-color: #E6E7E8; background-color: #E6E7E8;
@include skewY(-3deg); @include skewY(3deg);
z-index: 30; z-index: 40;
} }
h2{ h2{
@ -420,30 +424,30 @@ body.page-home {
#latest-announcement{ #latest-announcement{
position: relative; position: relative;
margin-top: -80px; margin-top: -80px;
padding: 240px 0; padding: 240px 0 160px;
color: $white; color: $white;
text-align: center; text-align: center;
>.container { >.container {
z-index: 21; z-index: 51;
} }
} }
#latest-announcement-bg{ #latest-announcement-bg{
@include skewY(3deg); @include skewY(-3deg);
z-index: 20; z-index: 30;
background: $purple image-url("latest-announce-bg.svg") bottom left no-repeat; background: $purple image-url("latest-announce-bg.svg") bottom left no-repeat;
background-size: 100%; background-size: 100%;
} }
#enterprise-intro { #enterprise-intro {
position: relative; position: relative;
padding: 180px 0; padding: 220px 0 180px;
margin-top: -80px; margin-top: -80px;
color: #fff; color: #fff;
>.container { >.container {
z-index: 21; z-index: 31;
} }
h2 { h2 {