add iterate graphic

This commit is contained in:
JT 2014-07-22 18:59:07 -07:00
parent 64c04b2b7e
commit 4660255869
5 changed files with 48 additions and 6 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.7 KiB

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.9 KiB

After

Width:  |  Height:  |  Size: 5.9 KiB

View File

@ -37,9 +37,9 @@
<div class="col-lg-6 col-md-6"> <div class="col-lg-6 col-md-6">
<div class="it-icon f-icon"> <div class="it-icon f-icon">
<div class="t-block"></div> <div class="t-block"></div>
<div class="t-block"></div> <div class="t-block t2"></div>
<div class="t-block"></div> <div class="t-block t3"></div>
<div class="t-block"></div> <div class="t-block t4"></div>
</div> </div>
</div> </div>
<div class="col-lg-6 col-md-6"> <div class="col-lg-6 col-md-6">
@ -58,9 +58,9 @@
<div class="col-lg-6 col-md-6"> <div class="col-lg-6 col-md-6">
<div class="clone-icon f-icon"> <div class="clone-icon f-icon">
<div class="t-block"></div> <div class="t-block"></div>
<div class="t-block"></div> <div class="t-block t2"></div>
<div class="t-block"></div> <div class="t-block t3"></div>
<div class="t-block"></div> <div class="t-block t4"></div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -71,6 +71,27 @@
.skewY(-2deg); .skewY(-2deg);
} }
.t-block{
background-color: rgb(255, 255, 255);
width: 80px;
height: 80px;
.skewY(26deg);
float: left;
margin-right: 25px;
&.t2{
background-color: rgba(255, 255, 255, .8);
}
&.t3{
background-color: rgba(255, 255, 255, .6);
}
&.t4{
background-color: rgba(255, 255, 255, .4);
}
}
h2{ h2{
color: white; color: white;
} }

View File

@ -603,6 +603,27 @@ body.page-sub #header {
-o-transform: skewY(-2deg); -o-transform: skewY(-2deg);
transform: skewY(-2deg); transform: skewY(-2deg);
} }
#feature-iterate .t-block {
background-color: #ffffff;
width: 80px;
height: 80px;
-webkit-transform: skewY(26deg);
-moz-transform: skewY(26deg);
-ms-transform: skewY(26deg);
-o-transform: skewY(26deg);
transform: skewY(26deg);
float: left;
margin-right: 25px;
}
#feature-iterate .t-block.t2 {
background-color: rgba(255, 255, 255, 0.8);
}
#feature-iterate .t-block.t3 {
background-color: rgba(255, 255, 255, 0.6);
}
#feature-iterate .t-block.t4 {
background-color: rgba(255, 255, 255, 0.4);
}
#feature-iterate h2 { #feature-iterate h2 {
color: white; color: white;
} }