have a gradient length that will likely workout for the long pages, but it looks...
authorIan Weller <ian@gaslightmedia.com>
Tue, 2 Feb 2016 20:59:07 +0000 (15:59 -0500)
committerIan Weller <ian@gaslightmedia.com>
Tue, 2 Feb 2016 20:59:07 +0000 (15:59 -0500)
css/app.css
scss/_main.scss
scss/mixins/_gradient.scss

index 82fe47b..de796bc 100644 (file)
@@ -6683,27 +6683,27 @@ header {
 #headerLinks {
   top: -1px; }
 
-@media screen and (max-width: 1024px) {
-  main.page-front {
-    padding: 0; } }
-main.page-front #content-wrapper {
-  background: -webkit-linear-gradient(top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
-  background: -moz-linear-gradient(center top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
-  background: -ms-linear-gradient(top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
+main.page-front {
+  background: -webkit-linear-gradient(top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
+  background: -moz-linear-gradient(center top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
+  background: -ms-linear-gradient(top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient StartColorStr=#d7e8f0, EndColorStr=rgba(255, 255, 255, 0); }
+  @media screen and (max-width: 1024px) {
+    main.page-front {
+      padding: 0; } }
   main.page-front #content-wrapper #main-content {
     margin: 37px auto; }
 
 main.page-inside {
-  padding-top: 2px; }
+  padding-top: 2px;
+  background: -webkit-linear-gradient(top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
+  background: -moz-linear-gradient(center top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
+  background: -ms-linear-gradient(top, #d7e8f0 92%, rgba(255, 255, 255, 0) 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient StartColorStr=#d7e8f0, EndColorStr=rgba(255, 255, 255, 0); }
   @media screen and (max-width: 1024px) {
     main.page-inside {
       padding: 0; } }
   main.page-inside #content-wrapper {
-    background: -webkit-linear-gradient(top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
-    background: -moz-linear-gradient(center top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
-    background: -ms-linear-gradient(top, #d7e8f0 51%, rgba(255, 255, 255, 0) 100%);
-    filter: progid:DXImageTransform.Microsoft.gradient StartColorStr=#d7e8f0, EndColorStr=rgba(255, 255, 255, 0);
     min-height: 250px; }
     main.page-inside #content-wrapper #main-content {
       background: #FFFFFF;
@@ -6777,9 +6777,9 @@ main.page-inside {
       margin-top: 25px;
       padding-top: 0; }
       .blocks #block-1.blocks:before, .blocks #block-2.blocks:before, .blocks #block-3.blocks:before {
-        background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 51%, #000000 100%);
-        background: -moz-linear-gradient(center top, rgba(255, 255, 255, 0) 51%, #000000 100%);
-        background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 51%, #000000 100%);
+        background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 92%, #000000 100%);
+        background: -moz-linear-gradient(center top, rgba(255, 255, 255, 0) 92%, #000000 100%);
+        background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 92%, #000000 100%);
         filter: progid:DXImageTransform.Microsoft.gradient StartColorStr=rgba(255, 255, 255, 0), EndColorStr=#000000;
         position: absolute;
         content: '';
index aefbdbd..f615b47 100644 (file)
@@ -3,8 +3,9 @@ main.page-front {
     @media screen and (max-width: 1024px) {
         padding: 0;
     }
+    @include gradient(#d7e8f0, rgba($white, 0));
     #content-wrapper {
-        @include gradient(#d7e8f0, rgba($white, 0));
+//        @include gradient(#d7e8f0, rgba($white, 0));
         #main-content {
             margin: 37px auto;
         }
@@ -15,9 +16,9 @@ main.page-inside {
     @media screen and (max-width: 1024px) {
         padding: 0;
     }
-//    @include gradient(#d7e8f0, rgba($white, 0));
+    @include gradient(#d7e8f0, rgba($white, 0));
     #content-wrapper {
-        @include gradient(#d7e8f0, rgba($white, 0));
+//        @include gradient(#d7e8f0, rgba($white, 0));
         min-height: 250px;
         #main-content {
             background: $white;
index f9058fb..44f134e 100644 (file)
@@ -4,8 +4,8 @@
 */
 
 @mixin gradient($from, $to) {
-    background: -webkit-linear-gradient(top, $from 51%, $to 100%);
-    background: -moz-linear-gradient(center top, $from 51%, $to 100%);
-    background: -ms-linear-gradient(top, $from 51%, $to 100%);
+    background: -webkit-linear-gradient(top, $from 92%, $to 100%);
+    background: -moz-linear-gradient(center top, $from 92%, $to 100%);
+    background: -ms-linear-gradient(top, $from 92%, $to 100%);
     filter: progid:DXImageTransform.Microsoft.gradient((StartColorStr=$from, EndColorStr=$to));
 }