Make the background and the footer gradiations customizable

This change extracts following variables for allowing customizatin:
- nav-bg-back
- nav-bg-front
- footer-bg-back
- footer-bg-front
This commit is contained in:
MORITA Hajime (omo) 2011-10-23 06:55:20 -07:00
parent 408ed3e1e2
commit 633b3389f3
4 changed files with 11 additions and 2 deletions

View File

@ -23,6 +23,8 @@ $type-border: #ddd !default;
/* Navigation */
$nav-bg: #ccc !default;
$nav-bg-front: image-url('noise.png');
$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11));
$nav-color: darken($nav-bg, 38) !default;
$nav-color-hover: darken($nav-color, 25) !default;
$nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default;
@ -46,6 +48,8 @@ $twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default;
$footer-color: #888 !default;
$footer-bg: #ccc !default;
$footer-bg-front: image-url('noise.png');
$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11));
$footer-color: darken($footer-bg, 38) !default;
$footer-color-hover: darken($footer-color, 10) !default;
$footer-border-top: lighten($footer-bg, 15) !default;

View File

@ -5,9 +5,14 @@
//$header-bg: #263347;
//$subtitle-color: lighten($header-bg, 58);
//$nav-bg: desaturate(lighten(#8fc17a, 18), 5);
//$nav-bg-front: image-url('noise.png');
//$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11));
//$sidebar-bg: desaturate(#eceff5, 8);
//$sidebar-link-color: saturate(#526f9a, 10);
//$sidebar-link-color-hover: darken(#7ab662, 9);
//$footer-bg: #ccc !default;
//$footer-bg-front: image-url('noise.png');
//$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-
/* To use the light Solarized highlighting theme uncomment the following line */

View File

@ -4,7 +4,7 @@ body > footer {
color: $footer-color;
text-shadow: lighten($footer-bg, 5) 0 1px;
background-color: $footer-bg;
@include background(image-url('noise.png'), linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)));
@include background($footer-bg-front, $footer-bg-back);
border-top: 1px solid $footer-border-top;
position: relative;
padding-top: 1em;

View File

@ -1,7 +1,7 @@
body > nav {
position: relative;
background-color: $nav-bg;
@include background(image-url('noise.png'), linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)));
@include background($nav-bg-front, $nav-bg-back);
border: {
top: 1px solid $nav-border-top;
bottom: 1px solid $nav-border-bottom; }