More use of sass variables. Reject flatly gray colors

2aaf6853 · Dmitriy Zaporozhets · 066fb568 · 2aaf6853 · 2aaf6853 · 2aaf6853
Commit 2aaf6853 authored Mar 17, 2015 by Dmitriy Zaporozhets
5 changed files
--- a/app/assets/stylesheets/base/gl_variables.scss
+++ b/app/assets/stylesheets/base/gl_variables.scss
@@ -15,12 +15,6 @@
 // $gray:                   lighten($gray-base, 33.5%) // #555
 // $gray-light:             lighten($gray-base, 46.7%) // #777
 // $gray-lighter:           lighten($gray-base, 93.5%) // #eee
-$gray-base:              #000;
-$gray-darker:            lighten($gray-base, 13.5%); // #222
-$gray-dark:              #7b8a8b;   // #333
-$gray:                   #95a5a6; // #555
-$gray-light:             #b4bcc2;   // #999
-$gray-lighter:           #ecf0f1; // #eee

 $brand-primary:  $gl-primary;
 $brand-success:  $gl-success;
@@ -36,7 +30,7 @@ $brand-danger:   $gl-danger;
 //** Background color for `<body>`.
 // $body-bg:               #fff
 //** Global text color on `<body>`.
-$text-color:            $brand-primary;
+$text-color:            $gl-text-color;

 //** Global textual link color.
 $link-color:            $gl-link-color;
@@ -763,8 +757,8 @@ $panel-default-heading-bg:    $background-color;
 //
 //##

-$well-bg:                     $gray-lighter;
-$well-border:                 transparent;
+//$well-bg:                     $gray-lighter;
+//$well-border:                 transparent;


 //== Badges
@@ -838,9 +832,9 @@ $code-bg:                     #f9f2f4;
 $kbd-color:                   #fff;
 $kbd-bg:                      #333;

-$pre-bg:                      $gray-lighter;
-$pre-color:                   $text-color;
-$pre-border-color:            #ccc;
+//$pre-bg:                      $gray-lighter;
+//$pre-color:                   $text-color;
+//$pre-border-color:            #ccc;
 // $pre-scrollable-max-height:   340px


@@ -855,7 +849,7 @@ $pre-border-color:            #ccc;
 //** Abbreviations and acronyms border color
 // $abbr-border-color:           $gray-light
 //** Headings small color
-$headings-small-color:        $gray-dark;
+//$headings-small-color:        $gray-dark;
 //** Blockquote small color
 // $blockquote-small-color:      $gray-light
 //** Blockquote font size

--- a/app/assets/stylesheets/base/variables.scss
+++ b/app/assets/stylesheets/base/variables.scss
 $style_color: #474D57;
 $hover: #FFF3EB;
+$gl-text-color: #222222;
 $gl-link-color: #446e9b;
 $nprogress-color: #c0392b;
 $gl-font-size: 14px;
@@ -8,8 +9,8 @@ $sidebar_width: 230px;
 $avatar_radius: 50%;
 $code_font_size: 13px;
 $code_line_height: 1.5;
-$border-color: #dce4ec;
-$background-color: #ECF0F1;
+$border-color: #E5E5E5;
+$background-color: #f5f5f5;

 /*
 * State colors:

--- a/app/assets/stylesheets/generic/forms.scss
+++ b/app/assets/stylesheets/generic/forms.scss
@@ -29,8 +29,8 @@ fieldset legend {
  padding: 17px 20px 18px;
  margin-top: 18px;
  margin-bottom: 18px;
-  background-color: #ecf0f1;
-  border-top: 1px solid #e5e5e5;
+  background-color: $background-color;
+  border-top: 1px solid $border-color;
 }

 @media (min-width: $screen-sm-min) {

--- a/app/assets/stylesheets/generic/nav_sidebar.scss
+++ b/app/assets/stylesheets/generic/nav_sidebar.scss
@@ -58,8 +58,6 @@
 }

 .nav-sidebar li {
-  text-shadow: 0 1px 1px $border-color;
-
  &.separate-item {
    border-top: 1px solid $border-color;
    padding-top: 10px;
@@ -67,7 +65,7 @@
  }

  a {
-    color: #3b5a5b;
+    color: $gray;
    display: block;
    text-decoration: none;
    padding: 8px 15px;
@@ -78,7 +76,7 @@
    &:hover {
      text-decoration: none;
      color: $text-color;
-      background: #f2f6f7;
+      background: $border-color;
    }

    &:active, &:focus {
@@ -87,7 +85,7 @@

    i {
      width: 20px;
-      color: $gray-dark;
+      color: $gray-light;
      margin-right: 23px;
    }
  }

--- a/app/assets/stylesheets/generic/timeline.scss
+++ b/app/assets/stylesheets/generic/timeline.scss
@@ -54,7 +54,7 @@

      .timeline-content {
        position: relative;
-        background: #f5f5f6;
+        background: $background-color;
        padding: 10px 15px;
        margin-left: 60px;

@@ -70,7 +70,7 @@
          height: 0;
          border-style: solid;
          border-width: 9px 9px 9px 0;
-          border-color: transparent #f5f5f6 transparent transparent;
+          border-color: transparent $background-color transparent transparent;
          left: 0;
          top: 10px;
          margin-left: -9px;