Browse code

Merge pull request #242 from omo/customizable-nav-gradient

Making the background and the footer gradiations customizable

Brandon Mathis authored on 24/10/2011 at 03:38:43
Showing 4 changed files
... ...
@@ -23,6 +23,8 @@ $type-border: #ddd !default;
23 23
 
24 24
 /* Navigation */
25 25
 $nav-bg: #ccc !default;
26
+$nav-bg-front: image-url('noise.png');
27
+$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11));
26 28
 $nav-color: darken($nav-bg, 38) !default;
27 29
 $nav-color-hover: darken($nav-color, 25) !default;
28 30
 $nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default;
... ...
@@ -46,6 +48,8 @@ $twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default;
46 46
 
47 47
 $footer-color: #888 !default;
48 48
 $footer-bg: #ccc !default;
49
+$footer-bg-front: image-url('noise.png');
50
+$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11));
49 51
 $footer-color: darken($footer-bg, 38) !default;
50 52
 $footer-color-hover: darken($footer-color, 10) !default;
51 53
 $footer-border-top: lighten($footer-bg, 15) !default;
... ...
@@ -5,9 +5,14 @@
5 5
 //$header-bg: #263347;
6 6
 //$subtitle-color: lighten($header-bg, 58);
7 7
 //$nav-bg: desaturate(lighten(#8fc17a, 18), 5);
8
+//$nav-bg-front: image-url('noise.png');
9
+//$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11));
8 10
 //$sidebar-bg: desaturate(#eceff5, 8);
9 11
 //$sidebar-link-color: saturate(#526f9a, 10);
10 12
 //$sidebar-link-color-hover: darken(#7ab662, 9);
13
+//$footer-bg: #ccc !default;
14
+//$footer-bg-front: image-url('noise.png');
15
+//$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-
11 16
 
12 17
 
13 18
 /* To use the light Solarized highlighting theme uncomment the following line */
... ...
@@ -4,7 +4,7 @@ body > footer {
4 4
   color: $footer-color;
5 5
   text-shadow: lighten($footer-bg, 5) 0 1px;
6 6
   background-color: $footer-bg;
7
-  @include background(image-url('noise.png'), linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)));
7
+  @include background($footer-bg-front, $footer-bg-back);
8 8
   border-top: 1px solid $footer-border-top;
9 9
   position: relative;
10 10
   padding-top: 1em;
... ...
@@ -1,7 +1,7 @@
1 1
 body > nav {
2 2
   position: relative;
3 3
   background-color: $nav-bg;
4
-  @include background(image-url('noise.png'), linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)));
4
+  @include background($nav-bg-front, $nav-bg-back);
5 5
   border: {
6 6
     top: 1px solid $nav-border-top;
7 7
     bottom: 1px solid $nav-border-bottom; }