1 files changed, 103 insertions, 0 deletions
diff --git a/app/assets/stylesheets/themes/theme_light_gray.scss b/app/assets/stylesheets/themes/theme_light_gray.scss
new file mode 100644
index 00000000000..ad19438d79a
--- /dev/null
+++ b/app/assets/stylesheets/themes/theme_light_gray.scss
@@ -0,0 +1,103 @@
+@import './theme_helper';
+
+body {
+  &.ui-light-gray {
+    @include gitlab-theme(
+      $gray-500,
+      $gray-700,
+      $gray-500,
+      $gray-900,
+      $gray-50,
+      $gray-500
+    );
+
+    .navbar-gitlab {
+      background-color: $gray-50;
+      box-shadow: 0 1px 0 0 $border-color;
+
+      .logo-text {
+        fill: #171321;
+      }
+
+      .navbar-sub-nav,
+      .navbar-nav {
+        > li {
+          > a:hover,
+          > a:focus,
+          > button:hover {
+            color: $gray-900;
+          }
+
+          &.active > a,
+          &.active > a:hover,
+          &.active > button {
+            color: $white;
+          }
+
+          > a,
+          > button {
+            &:active,
+            &:focus {
+              @include gl-focus;
+            }
+          }
+        }
+      }
+
+      .container-fluid {
+        .navbar-toggler,
+        .navbar-toggler:hover {
+          color: $gray-500;
+          border-left: 1px solid $gray-100;
+        }
+      }
+    }
+
+    .header-search {
+      background-color: $white !important;
+      box-shadow: inset 0 0 0 1px $border-color !important;
+      border-radius: $border-radius-default;
+
+      &:hover {
+        background-color: $white !important;
+        box-shadow: inset 0 0 0 1px $blue-200 !important;
+      }
+    }
+
+    .search {
+      form {
+        background-color: $white;
+        box-shadow: inset 0 0 0 1px $border-color;
+
+        &:hover {
+          background-color: $white;
+          box-shadow: inset 0 0 0 1px $blue-200;
+        }
+      }
+
+      .search-input-wrap {
+        .search-icon {
+          fill: $gray-100;
+        }
+
+        .search-input {
+          color: $gl-text-color;
+        }
+      }
+    }
+
+    .nav-sidebar li.active {
+      > a {
+        color: $gray-900;
+      }
+
+      svg {
+        fill: $gray-900;
+      }
+    }
+
+    .sidebar-top-level-items > li.active .badge.badge-pill {
+      color: $gray-900;
+    }
+  }
+}