add feature-create background art

This commit is contained in:
Jason Costello 2016-10-05 12:39:53 -07:00
parent 0fa913c772
commit 23a747ca06
2 changed files with 251 additions and 0 deletions

View File

@ -0,0 +1,245 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 879.2 664.5" style="enable-background:new 0 0 879.2 664.5;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.52;fill:url(#SVGID_1_);}
.st1{opacity:0.52;fill:url(#SVGID_2_);}
.st2{opacity:0.52;fill:url(#SVGID_3_);}
.st3{opacity:0.52;fill:url(#SVGID_4_);}
.st4{opacity:0.52;fill:url(#SVGID_5_);}
.st5{opacity:0.52;fill:url(#SVGID_6_);}
.st6{fill:url(#SVGID_7_);}
.st7{fill:#822FF7;}
</style>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="225.3979" y1="221.645" x2="539.0834" y2="221.645">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon class="st0" points="226.1,301.7 225.4,300.4 538.4,141.6 539.1,142.9 "/>
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="446.3393" y1="440.1357" x2="752.6869" y2="440.1357">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon class="st1" points="752,526.3 446.3,355.2 447.1,353.9 752.7,525 "/>
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="1426.1727" y1="5898.1221" x2="1834.2056" y2="5898.1221" gradientTransform="matrix(-0.5076 0.8616 -0.8616 -0.5076 6586.3955 1707.7247)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon class="st2" points="476,236.5 475.2,235.2 878.4,0 879.2,1.3 "/>
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="5788.917" y1="5500.6553" x2="5975.5288" y2="5500.6553" gradientTransform="matrix(-0.9952 -0.1382 0.134 -0.9995 5255.625 6727.6323)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon class="st3" points="225.8,467.1 50.5,368 51.2,366.7 226.6,465.8 "/>
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="74.726" y1="509.5166" x2="438.1894" y2="509.5166">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<polygon class="st4" points="75.5,613 74.7,611.7 437.4,406 438.2,407.3 "/>
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="3902.99" y1="403.425" x2="4290.8765" y2="403.425" gradientTransform="matrix(0.4437 -0.8962 0.8962 0.4437 -1741.5836 3760.6074)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="437" y="52" class="st5" width="1.5" height="432"/>
<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="3815.4343" y1="251.3103" x2="4140.3076" y2="251.3103" gradientTransform="matrix(0.4437 -0.8962 0.8962 0.4437 -1741.5836 3760.6074)">
<stop offset="0" style="stop-color:#FFFFFF"/>
<stop offset="5.420001e-02" style="stop-color:#FCF9FF;stop-opacity:0.9447"/>
<stop offset="0.1296" style="stop-color:#F4E7FF;stop-opacity:0.8678"/>
<stop offset="0.2174" style="stop-color:#E7C9FF;stop-opacity:0.7782"/>
<stop offset="0.3146" style="stop-color:#D4A0FF;stop-opacity:0.679"/>
<stop offset="0.4183" style="stop-color:#BC6CFF;stop-opacity:0.5732"/>
<stop offset="0.49" style="stop-color:#AA43FF;stop-opacity:0.5"/>
<stop offset="0.5514" style="stop-color:#BD6DFF;stop-opacity:0.5602"/>
<stop offset="0.6261" style="stop-color:#D199FF;stop-opacity:0.6334"/>
<stop offset="0.7017" style="stop-color:#E2BEFF;stop-opacity:0.7075"/>
<stop offset="0.7769" style="stop-color:#EEDAFF;stop-opacity:0.7813"/>
<stop offset="0.8519" style="stop-color:#F8EFFF;stop-opacity:0.8548"/>
<stop offset="0.9264" style="stop-color:#FDFBFF;stop-opacity:0.9278"/>
<stop offset="1" style="stop-color:#FFFFFF"/>
</linearGradient>
<rect x="247.8" y="126.4" class="st6" width="1.5" height="361.7"/>
<g>
<g>
<path class="st7" d="M93.4,256.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L93.4,256.7 M93.4,254.4l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L93.4,254.4L93.4,254.4z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M125.1,201.8l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L125.1,201.8 M125.1,199.5l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L125.1,199.5L125.1,199.5z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M188.5,201.8l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L188.5,201.8 M188.5,199.5l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L188.5,199.5L188.5,199.5z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M125.1,311.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L125.1,311.7 M125.1,309.4L94.5,327v35.3l30.6,17.7
l30.6-17.7V327L125.1,309.4L125.1,309.4z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M30,257.4l28,16.2v32.3l-28,16.2L2,305.9v-32.3L30,257.4 M30,255.1L0,272.4v34.6l30,17.3l30-17.3v-34.6
L30,255.1L30,255.1z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M156.8,256.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L156.8,256.7 M156.8,254.4l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L156.8,254.4L156.8,254.4z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M567.8,257.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L567.8,257.7 M567.8,255.4l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L567.8,255.4L567.8,255.4z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M599.5,202.8l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L599.5,202.8 M599.5,200.5l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L599.5,200.5L599.5,200.5z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M662.9,202.8l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L662.9,202.8 M662.9,200.5l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L662.9,200.5L662.9,200.5z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M599.5,312.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L599.5,312.7 M599.5,310.4L568.9,328v35.3l30.6,17.7
l30.6-17.7V328L599.5,310.4L599.5,310.4z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M504.4,258.4l28,16.2v32.3l-28,16.2l-28-16.2v-32.3L504.4,258.4 M504.4,256.1l-30,17.3v34.6l30,17.3l30-17.3
v-34.6L504.4,256.1L504.4,256.1z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M631.2,257.7l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L631.2,257.7 M631.2,255.4l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L631.2,255.4L631.2,255.4z"/>
</g>
</g>
<g>
<g>
<g>
<path class="st7" d="M342.6,541.2l28.6,16.5v33l-28.6,16.5L314,590.7v-33L342.6,541.2 M342.6,538.9L312,556.6v35.3l30.6,17.7
l30.6-17.7v-35.3L342.6,538.9L342.6,538.9z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M374.3,486.3l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L374.3,486.3 M374.3,484l-30.6,17.7V537l30.6,17.7
l30.6-17.7v-35.3L374.3,484L374.3,484z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M437.8,486.3l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L437.8,486.3 M437.8,484l-30.6,17.7V537l30.6,17.7
l30.6-17.7v-35.3L437.8,484L437.8,484z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M374.3,596.2l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L374.3,596.2 M374.3,593.8l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L374.3,593.8L374.3,593.8z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M279.2,541.9l28,16.2v32.3l-28,16.2l-28-16.2v-32.3L279.2,541.9 M279.2,539.6l-30,17.3v34.6l30,17.3l30-17.3
v-34.6L279.2,539.6L279.2,539.6z"/>
</g>
</g>
<g>
<g>
<path class="st7" d="M406.1,541.2l28.6,16.5v33l-28.6,16.5l-28.6-16.5v-33L406.1,541.2 M406.1,538.9l-30.6,17.7v35.3l30.6,17.7
l30.6-17.7v-35.3L406.1,538.9L406.1,538.9z"/>
</g>
</g>
</g>
<polygon class="st7" points="305.6,328.2 305.6,416.5 380.1,374.2 380.1,289.7 "/>
</svg>

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -171,9 +171,15 @@ body.page-home {
padding: 240px 0 300px; padding: 240px 0 300px;
>.container{ >.container{
background: image-url("feature-create-bg.svg") 95% 20% no-repeat;
background-size: 40%;
z-index: 21; z-index: 21;
} }
p.lead {
margin-bottom: 220px;
}
#feature-create-bg{ #feature-create-bg{
@include skewY(3deg); @include skewY(3deg);
z-index: 20; z-index: 20;