Fix specs; start on light theme

8 files changed, 67 insertions, 34 deletions

diff --git a/app/assets/stylesheets/framework.scss b/app/assets/stylesheets/framework.scss
index 14e19134302..35e7a10379f 100644
--- a/app/assets/stylesheets/framework.scss
+++ b/app/assets/stylesheets/framework.scss
@@ -19,7 +19,7 @@
 @import "framework/flash";
 @import "framework/forms";
 @import "framework/gfm";
-@import "framework/gitlab-theme.scss";
+@import "framework/gitlab-theme";
 @import "framework/header";
 @import "framework/highlight";
 @import "framework/issue_box";
diff --git a/app/assets/stylesheets/framework/gitlab-theme.scss b/app/assets/stylesheets/framework/gitlab-theme.scss
index a860791b5f6..35c952af51b 100644
--- a/app/assets/stylesheets/framework/gitlab-theme.scss
+++ b/app/assets/stylesheets/framework/gitlab-theme.scss
@@ -118,7 +118,7 @@
       border-right: 1px solid $color-800;
     }
 
-    .search-input::placeholder  {
+    .search-input::placeholder {
       color: rgba($color-200, .8);
     }
 
@@ -173,10 +173,27 @@ body {
   }
 
   &.ui_dark {
-    @include gitlab-theme($dark-100, $dark-200, $dark-500, $dark-700, $dark-800, $dark-900);
+    @include gitlab-theme($theme-gray-100, $theme-gray-200, $theme-gray-500, $theme-gray-700, $theme-gray-800, $theme-gray-900);
+  }
+
+  &.ui_light {
+    @include gitlab-theme($theme-gray-900, $theme-gray-700, $theme-gray-800, $theme-gray-500, $theme-gray-200, $theme-gray-100);
+
+    header.navbar-gitlab-new {
+      background: linear-gradient(to right, $theme-gray-100, $theme-gray-100);
+      box-shadow: 0 2px 0 0 $border-color;
+
+      .logo-text svg {
+        fill: $theme-gray-900;
+      }
+    }
   }
 
   &.ui_blue {
     @include gitlab-theme($theme-blue-100, $theme-blue-200, $theme-blue-500, $theme-blue-700, $theme-blue-800, $theme-blue-900);
   }
+
+  &.ui_green {
+    @include gitlab-theme($theme-green-100, $theme-green-200, $theme-green-500, $theme-green-700, $theme-green-800, $theme-green-900);
+  }
 }
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index adf30e81158..becdd7ff35b 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -88,19 +88,19 @@ $indigo-800: #393982;
 $indigo-900: #292961;
 $indigo-950: #1a1a40;
 
-$dark-50:  #fafafa;
-$dark-100: #f2f2f2;
-$dark-200: #dfdfdf;
-$dark-300: #cccccc;
-$dark-400: #bababa;
-$dark-500: #a7a7a7;
-$dark-600: #949494;
-$dark-700: #707070;
-$dark-800: #4f4f4f;
-$dark-900: #2e2e2e;
-$dark-950: #1f1f1f;
-
-$theme-blue-50:  #f4f8fc;
+$theme-gray-50: #fafafa;
+$theme-gray-100: #f2f2f2;
+$theme-gray-200: #dfdfdf;
+$theme-gray-300: #cccccc;
+$theme-gray-400: #bababa;
+$theme-gray-500: #a7a7a7;
+$theme-gray-600: #949494;
+$theme-gray-700: #707070;
+$theme-gray-800: #4f4f4f;
+$theme-gray-900: #2e2e2e;
+$theme-gray-950: #1f1f1f;
+
+$theme-blue-50: #f4f8fc;
 $theme-blue-100: #e6edf5;
 $theme-blue-200: #c8d7e6;
 $theme-blue-300: #97b3cf;
@@ -112,6 +112,18 @@ $theme-blue-800: #25496e;
 $theme-blue-900: #1a3652;
 $theme-blue-950: #0f2235;
 
+$theme-green-50: #f2faf6;
+$theme-green-100: #e4f3ea;
+$theme-green-200: #c0dfcd;
+$theme-green-300: #8ac2a1;
+$theme-green-400: #52a274;
+$theme-green-500: #35935c;
+$theme-green-600: #288a50;
+$theme-green-700: #1c7441;
+$theme-green-800: #145d33;
+$theme-green-900: #0d4524;
+$theme-green-950: #072d16;
+
 
 $black: #000;
 $black-transparent: rgba(0, 0, 0, 0.3);
diff --git a/app/assets/stylesheets/new_nav.scss b/app/assets/stylesheets/new_nav.scss
index a045f0d16d5..d85b19dee46 100644
--- a/app/assets/stylesheets/new_nav.scss
+++ b/app/assets/stylesheets/new_nav.scss
@@ -12,6 +12,17 @@ header.navbar-gitlab-new {
   border-bottom: 0;
   min-height: $new-navbar-height;
 
+  .logo-text {
+    line-height: initial;
+
+    svg {
+      width: 55px;
+      height: 14px;
+      margin: 0;
+      fill: $white-light;
+    }
+  }
+
   .header-content {
     display: -webkit-flex;
     display: flex;
@@ -37,10 +48,10 @@ header.navbar-gitlab-new {
 
       img {
         height: 28px;
-        margin-right: 10px;
+        margin-right: 8px;
       }
 
-      > a {
+      a {
         display: -webkit-flex;
         display: flex;
         align-items: center;
@@ -53,17 +64,6 @@ header.navbar-gitlab-new {
             margin-right: 8px;
           }
         }
-
-        .logo-text {
-          line-height: initial;
-
-          svg {
-            width: 55px;
-            height: 14px;
-            margin: 0;
-            fill: $white-light;
-          }
-        }
       }
     }
 
diff --git a/config/gitlab.yml.example b/config/gitlab.yml.example
index 2213a1188ee..cd44f888d3f 100644
--- a/config/gitlab.yml.example
+++ b/config/gitlab.yml.example
@@ -79,7 +79,9 @@ production: &base
     ## Default theme ID
     ##   1 - Indigo
     ##   2 - Dark
-    ##   3 - Blue
+    ##   3 - Light
+    ##   4 - Blue
+    ##   5 - Green
     # default_theme: 1 # default: 1
 
     ## Automatic issue closing
diff --git a/lib/gitlab/themes.rb b/lib/gitlab/themes.rb
index e0be799b551..5e1e65854a3 100644
--- a/lib/gitlab/themes.rb
+++ b/lib/gitlab/themes.rb
@@ -14,7 +14,9 @@ module Gitlab
     THEMES = [
       Theme.new(1, 'Indigo', 'ui_indigo'),
       Theme.new(2, 'Dark', 'ui_dark'),
-      Theme.new(3, 'Blue', 'ui_blue')
+      Theme.new(3, 'Light', 'ui_light'),
+      Theme.new(4, 'Blue', 'ui_blue'),
+      Theme.new(5, 'Green', 'ui_green'),
     ].freeze
 
     # Convenience method to get a space-separated String of all the theme
diff --git a/spec/helpers/preferences_helper_spec.rb b/spec/helpers/preferences_helper_spec.rb
index 50ac3886a36..d85773306ab 100644
--- a/spec/helpers/preferences_helper_spec.rb
+++ b/spec/helpers/preferences_helper_spec.rb
@@ -31,7 +31,7 @@ describe PreferencesHelper do
       it "returns user's theme's css_class" do
         stub_user(theme_id: 3)
 
-        expect(helper.user_application_theme).to eq 'ui_green'
+        expect(helper.user_application_theme).to eq 'ui_light'
       end
 
       it 'returns the default when id is invalid' do
@@ -39,7 +39,7 @@ describe PreferencesHelper do
 
         allow(Gitlab.config.gitlab).to receive(:default_theme).and_return(2)
 
-        expect(helper.user_application_theme).to eq 'ui_charcoal'
+        expect(helper.user_application_theme).to eq 'ui_dark'
       end
     end
 
diff --git a/spec/models/user_spec.rb b/spec/models/user_spec.rb
index 961f891f559..07db6435e13 100644
--- a/spec/models/user_spec.rb
+++ b/spec/models/user_spec.rb
@@ -727,7 +727,7 @@ describe User do
       it "applies defaults to user" do
         expect(user.projects_limit).to eq(123)
         expect(user.can_create_group).to be_falsey
-        expect(user.theme_id).to eq(1)
+        expect(user.theme_id).to eq(2)
       end
     end