Skip to content

Commit f40ac52

Browse files
author
JT
committed
change degree to 3 for more drastic effect
1 parent 040f4f4 commit f40ac52

3 files changed

Lines changed: 110 additions & 100 deletions

File tree

website/source/stylesheets/_footer.less

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,13 @@
44
padding: 0 0 50px 0;
55
}
66

7+
body.page-home{
8+
#footer{
9+
margin-top: -40px;
10+
}
11+
}
12+
13+
714
#footer{
815
padding: 140px 0 40px;
916
color: black;

website/source/stylesheets/_home.less

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -43,10 +43,10 @@
4343
margin-top: -36px;
4444
background: #fff url(../images/white-wireframe.png) center top no-repeat;
4545
background-size: cover;
46-
.skewY(-2deg);
46+
.skewY(-3deg);
4747

4848
>.container{
49-
.skewY(2deg);
49+
.skewY(3deg);
5050
}
5151

5252
h2{
@@ -77,10 +77,10 @@
7777
border-top: 2px solid white;
7878
border-bottom: 2px solid @purple;
7979
background-size: cover;
80-
.skewY(2deg);
80+
.skewY(3deg);
8181

8282
>.container{
83-
.skewY(-2deg);
83+
.skewY(-3deg);
8484
}
8585

8686
p{
@@ -124,10 +124,10 @@
124124
padding: 240px 0 300px;
125125
color: white;
126126
background-color: @purple;
127-
.skewY(2deg);
127+
.skewY(3deg);
128128

129129
>.container{
130-
.skewY(-2deg);
130+
.skewY(-3deg);
131131
}
132132

133133
h2{
@@ -174,35 +174,13 @@
174174
}
175175

176176

177-
178-
@media (max-width: 992px) {
179-
#features{
180-
.double-row{
181-
padding: 0 0 0 0;
182-
.row{
183-
padding-bottom: 90px;
184-
}
185-
}
186-
187-
.icn{
188-
height: 200px;
189-
}
190-
}
191-
}
192-
193-
@media (max-width: 480px) {
194-
#features{
195-
text-align: center;
196-
}
197-
}
198-
199177
#cta {
200-
padding: 180px 0;
178+
padding: 180px 0 220px;
201179
background-color: @purple;
202-
.skewY(-2deg);
180+
.skewY(-3deg);
203181

204182
>.container{
205-
.skewY(2deg);
183+
.skewY(3deg);
206184
}
207185

208186
.intro {
@@ -255,10 +233,10 @@
255233
padding: 180px 0 60px;
256234
background-color: #000;
257235
margin-top: -80px;
258-
.skewY(-2deg);
236+
.skewY(-3deg);
259237

260238
>.container{
261-
.skewY(2deg);
239+
.skewY(3deg);
262240
}
263241

264242
.explantion {
@@ -397,6 +375,28 @@
397375
}
398376
}
399377

378+
@media (max-width: 992px) {
379+
#features{
380+
.double-row{
381+
padding: 0 0 0 0;
382+
.row{
383+
padding-bottom: 90px;
384+
}
385+
}
386+
387+
.icn{
388+
height: 200px;
389+
}
390+
}
391+
}
392+
393+
@media (max-width: 480px) {
394+
#features{
395+
text-align: center;
396+
}
397+
}
398+
399+
400400

401401
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
402402
#demos{

website/source/stylesheets/main.css

Lines changed: 70 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -324,6 +324,9 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
324324
background-color: white;
325325
padding: 0 0 50px 0;
326326
}
327+
body.page-home #footer {
328+
margin-top: -40px;
329+
}
327330
#footer {
328331
padding: 140px 0 40px;
329332
color: black;
@@ -624,18 +627,18 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
624627
margin-top: -36px;
625628
background: #ffffff url(../images/white-wireframe.png) center top no-repeat;
626629
background-size: cover;
627-
-webkit-transform: skewY(-2deg);
628-
-moz-transform: skewY(-2deg);
629-
-ms-transform: skewY(-2deg);
630-
-o-transform: skewY(-2deg);
631-
transform: skewY(-2deg);
630+
-webkit-transform: skewY(-3deg);
631+
-moz-transform: skewY(-3deg);
632+
-ms-transform: skewY(-3deg);
633+
-o-transform: skewY(-3deg);
634+
transform: skewY(-3deg);
632635
}
633636
#feature-auto > .container {
634-
-webkit-transform: skewY(2deg);
635-
-moz-transform: skewY(2deg);
636-
-ms-transform: skewY(2deg);
637-
-o-transform: skewY(2deg);
638-
transform: skewY(2deg);
637+
-webkit-transform: skewY(3deg);
638+
-moz-transform: skewY(3deg);
639+
-ms-transform: skewY(3deg);
640+
-o-transform: skewY(3deg);
641+
transform: skewY(3deg);
639642
}
640643
#feature-auto h2 {
641644
font-size: 41px;
@@ -661,18 +664,18 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
661664
border-top: 2px solid white;
662665
border-bottom: 2px solid #822ff7;
663666
background-size: cover;
664-
-webkit-transform: skewY(2deg);
665-
-moz-transform: skewY(2deg);
666-
-ms-transform: skewY(2deg);
667-
-o-transform: skewY(2deg);
668-
transform: skewY(2deg);
667+
-webkit-transform: skewY(3deg);
668+
-moz-transform: skewY(3deg);
669+
-ms-transform: skewY(3deg);
670+
-o-transform: skewY(3deg);
671+
transform: skewY(3deg);
669672
}
670673
#feature-iterate > .container {
671-
-webkit-transform: skewY(-2deg);
672-
-moz-transform: skewY(-2deg);
673-
-ms-transform: skewY(-2deg);
674-
-o-transform: skewY(-2deg);
675-
transform: skewY(-2deg);
674+
-webkit-transform: skewY(-3deg);
675+
-moz-transform: skewY(-3deg);
676+
-ms-transform: skewY(-3deg);
677+
-o-transform: skewY(-3deg);
678+
transform: skewY(-3deg);
676679
}
677680
#feature-iterate p {
678681
text-align: right;
@@ -711,18 +714,18 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
711714
padding: 240px 0 300px;
712715
color: white;
713716
background-color: #822ff7;
714-
-webkit-transform: skewY(2deg);
715-
-moz-transform: skewY(2deg);
716-
-ms-transform: skewY(2deg);
717-
-o-transform: skewY(2deg);
718-
transform: skewY(2deg);
717+
-webkit-transform: skewY(3deg);
718+
-moz-transform: skewY(3deg);
719+
-ms-transform: skewY(3deg);
720+
-o-transform: skewY(3deg);
721+
transform: skewY(3deg);
719722
}
720723
#feature-clone > .container {
721-
-webkit-transform: skewY(-2deg);
722-
-moz-transform: skewY(-2deg);
723-
-ms-transform: skewY(-2deg);
724-
-o-transform: skewY(-2deg);
725-
transform: skewY(-2deg);
724+
-webkit-transform: skewY(-3deg);
725+
-moz-transform: skewY(-3deg);
726+
-ms-transform: skewY(-3deg);
727+
-o-transform: skewY(-3deg);
728+
transform: skewY(-3deg);
726729
}
727730
#feature-clone h2 {
728731
color: white;
@@ -761,37 +764,21 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
761764
transform: skewY(30deg);
762765
margin: 5px 5px 0 0;
763766
}
764-
@media (max-width: 992px) {
765-
#features .double-row {
766-
padding: 0 0 0 0;
767-
}
768-
#features .double-row .row {
769-
padding-bottom: 90px;
770-
}
771-
#features .icn {
772-
height: 200px;
773-
}
774-
}
775-
@media (max-width: 480px) {
776-
#features {
777-
text-align: center;
778-
}
779-
}
780767
#cta {
781-
padding: 180px 0;
768+
padding: 180px 0 220px;
782769
background-color: #822ff7;
783-
-webkit-transform: skewY(-2deg);
784-
-moz-transform: skewY(-2deg);
785-
-ms-transform: skewY(-2deg);
786-
-o-transform: skewY(-2deg);
787-
transform: skewY(-2deg);
770+
-webkit-transform: skewY(-3deg);
771+
-moz-transform: skewY(-3deg);
772+
-ms-transform: skewY(-3deg);
773+
-o-transform: skewY(-3deg);
774+
transform: skewY(-3deg);
788775
}
789776
#cta > .container {
790-
-webkit-transform: skewY(2deg);
791-
-moz-transform: skewY(2deg);
792-
-ms-transform: skewY(2deg);
793-
-o-transform: skewY(2deg);
794-
transform: skewY(2deg);
777+
-webkit-transform: skewY(3deg);
778+
-moz-transform: skewY(3deg);
779+
-ms-transform: skewY(3deg);
780+
-o-transform: skewY(3deg);
781+
transform: skewY(3deg);
795782
}
796783
#cta .intro .left {
797784
text-align: right;
@@ -828,18 +815,18 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
828815
padding: 180px 0 60px;
829816
background-color: #000;
830817
margin-top: -80px;
831-
-webkit-transform: skewY(-2deg);
832-
-moz-transform: skewY(-2deg);
833-
-ms-transform: skewY(-2deg);
834-
-o-transform: skewY(-2deg);
835-
transform: skewY(-2deg);
818+
-webkit-transform: skewY(-3deg);
819+
-moz-transform: skewY(-3deg);
820+
-ms-transform: skewY(-3deg);
821+
-o-transform: skewY(-3deg);
822+
transform: skewY(-3deg);
836823
}
837824
#demos > .container {
838-
-webkit-transform: skewY(2deg);
839-
-moz-transform: skewY(2deg);
840-
-ms-transform: skewY(2deg);
841-
-o-transform: skewY(2deg);
842-
transform: skewY(2deg);
825+
-webkit-transform: skewY(3deg);
826+
-moz-transform: skewY(3deg);
827+
-ms-transform: skewY(3deg);
828+
-o-transform: skewY(3deg);
829+
transform: skewY(3deg);
843830
}
844831
#demos .explantion {
845832
margin: 40px 0 60px 15px;
@@ -954,6 +941,22 @@ body.page-sub #header .main-links.navbar-nav li + li::before {
954941
#demos .terminals .terminal-item .feature-bullets li {
955942
padding: 5px 0 5px 45px;
956943
}
944+
@media (max-width: 992px) {
945+
#features .double-row {
946+
padding: 0 0 0 0;
947+
}
948+
#features .double-row .row {
949+
padding-bottom: 90px;
950+
}
951+
#features .icn {
952+
height: 200px;
953+
}
954+
}
955+
@media (max-width: 480px) {
956+
#features {
957+
text-align: center;
958+
}
959+
}
957960
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
958961
#demos .terminals .terminal-item .feature-bullets li {
959962
background-size: 12px 12px;

0 commit comments

Comments
 (0)