Add blue theme

app/assets/stylesheets/framework/gitlab-theme.scss

@@ -167,9 +167,6 @@
 }
 
 
-
-
-
 body {
   &.ui_indigo {
     @include gitlab-theme($indigo-100, $indigo-200, $indigo-500, $indigo-700, $indigo-800, $indigo-900);
@@ -178,4 +175,8 @@ body {
   &.ui_dark {
     @include gitlab-theme($dark-100, $dark-200, $dark-500, $dark-700, $dark-800, $dark-900);
   }
+
+  &.ui_blue {
+    @include gitlab-theme($theme-blue-100, $theme-blue-200, $theme-blue-500, $theme-blue-700, $theme-blue-800, $theme-blue-900);
+  }
 }

app/assets/stylesheets/framework/variables.scss

@@ -74,6 +74,8 @@ $red-700: #a62d19;
 $red-800: #8b2615;
 $red-900: #711e11;
 
+// GitLab themes
+
 $indigo-50: #f7f7ff;
 $indigo-100: #ebebfa;
 $indigo-200: #d1d1f0;
@@ -98,6 +100,19 @@ $dark-800: #4f4f4f;
 $dark-900: #2e2e2e;
 $dark-950: #1f1f1f;
 
+$theme-blue-50:  #f4f8fc;
+$theme-blue-100: #e6edf5;
+$theme-blue-200: #c8d7e6;
+$theme-blue-300: #97b3cf;
+$theme-blue-400: #648cb4;
+$theme-blue-500: #4a79a8;
+$theme-blue-600: #3e6fa0;
+$theme-blue-700: #305c88;
+$theme-blue-800: #25496e;
+$theme-blue-900: #1a3652;
+$theme-blue-950: #0f2235;
+
+
 $black: #000;
 $black-transparent: rgba(0, 0, 0, 0.3);
 $almost-black: #242424;

config/gitlab.yml.example

@@ -79,6 +79,7 @@ production: &base
     ## Default theme ID
     ##   1 - Indigo
     ##   2 - Dark
+    ##   3 - Blue
     # default_theme: 1 # default: 1
 
     ## Automatic issue closing

lib/gitlab/themes.rb

@@ -13,7 +13,8 @@ module Gitlab
     # All available Themes
     THEMES = [
       Theme.new(1, 'Indigo', 'ui_indigo'),
-      Theme.new(2, 'Dark', 'ui_dark')
+      Theme.new(2, 'Dark', 'ui_dark'),
+      Theme.new(3, 'Blue', 'ui_blue')
     ].freeze
 
     # Convenience method to get a space-separated String of all the theme

spec/lib/gitlab/themes_spec.rb

@@ -6,15 +6,15 @@ describe Gitlab::Themes, lib: true do
       css = described_class.body_classes
 
       expect(css).to include('ui_indigo')
-      # expect(css).to include(' ui_charcoal ')
-      # expect(css).to include(' ui_blue')
+      expect(css).to include(' ui_dark ')
+      expect(css).to include(' ui_blue')
     end
   end
 
   describe '.by_id' do
     it 'returns a Theme by its ID' do
       expect(described_class.by_id(1).name).to eq 'Indigo'
-      # expect(described_class.by_id(6).name).to eq 'Blue'
+      expect(described_class.by_id(3).name).to eq 'Blue'
     end
   end