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

reposition feature images, correct skew issue

This commit is contained in:
Jason Costello 2016-10-09 22:45:56 -07:00
parent eded063a4e
commit 4df9f1ac23
2 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -211,11 +211,20 @@ body.page-home {
} }
#feature-write-bg{ #feature-write-bg{
background: $white image-url("feature-write-bg.svg") 85% bottom no-repeat; background: $white;
background-size: 570px; background-size: 570px;
z-index: 70; z-index: 70;
@include skewY(3deg); @include skewY(3deg);
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
overflow: hidden;
.feature-image {
position: absolute;
bottom: 0;
right:10%;
width: 560px;
@include skewY(-3deg);
}
} }
} }
@ -251,8 +260,6 @@ body.page-home {
padding: 240px 0 180px; padding: 240px 0 180px;
>.container{ >.container{
background: image-url("feature-create-bg.svg") 95% 20% no-repeat;
background-size: 42%;
z-index: 51; z-index: 51;
} }
@ -262,10 +269,17 @@ body.page-home {
#feature-create-bg{ #feature-create-bg{
@include skewY(3deg); @include skewY(3deg);
z-index: 50; z-index: 50;
overflow: hidden;
} }
#feature-create-img{
position: absolute;
width: 420px;
top: 200px;
right: 100px;
@include skewY(-3deg);
}
} }
#demos{ #demos{

8
website/source/index.html.erb
View File

@ -88,7 +88,9 @@
</div> </div>
</div> </div>
</div> <!-- /container --> </div> <!-- /container -->
<div class="feature-skew" id="feature-write-bg"></div> <div class="feature-skew" id="feature-write-bg">
<img class="feature-image" src="/assets/images/feature-write-bg.svg" />
</div>
</div> <!-- /feature --> </div> <!-- /feature -->
<div class="skew-item feature" id="feature-plan"> <div class="skew-item feature" id="feature-plan">
@ -150,7 +152,9 @@
</div> </div>
</div> </div>
</div> <!-- /container --> </div> <!-- /container -->
<div class="feature-skew" id="feature-create-bg"></div> <div class="feature-skew" id="feature-create-bg">
<img id="feature-create-img" class="feature-image" src="/assets/images/feature-create-bg.svg" />
</div>
</div> <!-- /feature --> </div> <!-- /feature -->
<div class="skew-item" id="demos"> <div class="skew-item" id="demos">