diff --git a/app/assets/stylesheets/startup/startup-dark.scss b/app/assets/stylesheets/startup/startup-dark.scss
index 71c998832975712dc89ae5e9afd8bcc16602dcf0..9f2b249e714d38da4c9ef71e8cd881b007f78a49 100644
--- a/app/assets/stylesheets/startup/startup-dark.scss
+++ b/app/assets/stylesheets/startup/startup-dark.scss
@@ -10,7 +10,6 @@ body.gl-dark {
--gray-50: #303030;
--gray-100: #404040;
--gray-200: #525252;
- --gray-600: #bfbfbf;
--gray-700: #dbdbdb;
--gray-900: #fafafa;
--green-100: #0d532a;
@@ -1791,9 +1790,6 @@ body.gl-dark {
.avatar {
background: rgba(255, 255, 255, 0.04);
}
-.nav-sidebar li a {
- color: var(--gray-600);
-}
body.gl-dark {
--gl-theme-accent: #868686;
}
diff --git a/app/assets/stylesheets/themes/dark_mode_overrides.scss b/app/assets/stylesheets/themes/dark_mode_overrides.scss
index 9348216c2ac7f07f9f728b2d72165b50e7d732a6..e1ba2a69420682f82f29a438b14d4d036e51a74d 100644
--- a/app/assets/stylesheets/themes/dark_mode_overrides.scss
+++ b/app/assets/stylesheets/themes/dark_mode_overrides.scss
@@ -60,12 +60,6 @@
}
.nav-sidebar {
- li {
- a {
- color: var(--gray-600);
- }
- }
-
.sidebar-sub-level-items.fly-out-list {
box-shadow: none;
border: 1px solid $border-color;
@@ -78,7 +72,7 @@ aside.right-sidebar:not(.right-sidebar-merge-requests) {
}
body.gl-dark {
- @include gitlab-theme($gray-900, $gray-400, $gray-500, $gray-900, $gray-900, $white);
+ @include gitlab-theme($gray-900, $gray-400, $gray-500, $gray-900, $white);
.terms {
.logo-text {
diff --git a/app/assets/stylesheets/themes/theme_blue.scss b/app/assets/stylesheets/themes/theme_blue.scss
index 817557f37cdb690a631e905b591dc8c204280fc4..90122cec31feff21f8852693b2ddc6d7dd11506a 100644
--- a/app/assets/stylesheets/themes/theme_blue.scss
+++ b/app/assets/stylesheets/themes/theme_blue.scss
@@ -6,7 +6,6 @@ body {
$theme-blue-200,
$theme-blue-500,
$theme-blue-700,
- $gray-900,
$theme-blue-900,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_gray.scss b/app/assets/stylesheets/themes/theme_gray.scss
index 75b111f90c7ce5f9d66032d6773ea121056c7505..a6cdfb36a7c497a01f8543a52a543b601ae12b88 100644
--- a/app/assets/stylesheets/themes/theme_gray.scss
+++ b/app/assets/stylesheets/themes/theme_gray.scss
@@ -7,7 +7,6 @@ body {
$gray-300,
$gray-500,
$gray-900,
- $gray-900,
$white
);
}
diff --git a/app/assets/stylesheets/themes/theme_green.scss b/app/assets/stylesheets/themes/theme_green.scss
index 7e387e974521aaf9e555a977806abe8440980d6c..0300f261d644c7e25e05c58f5cf6bfef0bd300ab 100644
--- a/app/assets/stylesheets/themes/theme_green.scss
+++ b/app/assets/stylesheets/themes/theme_green.scss
@@ -6,7 +6,6 @@ body {
$theme-green-200,
$theme-green-500,
$theme-green-700,
- $gray-900,
$theme-green-900,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_helper.scss b/app/assets/stylesheets/themes/theme_helper.scss
index 042e21cebd6f499c80a53ad88cc325249a271876..d644d8acc988bb73bd6600836994a6a7ad0b0b1c 100644
--- a/app/assets/stylesheets/themes/theme_helper.scss
+++ b/app/assets/stylesheets/themes/theme_helper.scss
@@ -6,18 +6,22 @@
$search-and-nav-links,
$accent,
$border-and-box-shadow,
- $sidebar-text,
- $nav-svg-color,
- $color-alternate
+ $navbar-theme-color,
+ $navbar-theme-contrast-color
) {
// Set custom properties
--gl-theme-accent: #{$accent};
+ $search-and-nav-links-a20: rgba($search-and-nav-links, 0.2);
+ $search-and-nav-links-a30: rgba($search-and-nav-links, 0.3);
+ $search-and-nav-links-a40: rgba($search-and-nav-links, 0.4);
+ $search-and-nav-links-a80: rgba($search-and-nav-links, 0.8);
+
// Header
.navbar-gitlab {
- background-color: $nav-svg-color;
+ background-color: $navbar-theme-color;
.navbar-collapse {
color: $search-and-nav-links;
@@ -37,7 +41,7 @@
> button {
&:hover,
&:focus {
- background-color: rgba($search-and-nav-links, 0.2);
+ background-color: $search-and-nav-links-a20;
}
}
@@ -45,13 +49,13 @@
&.dropdown.show {
> a,
> button {
- color: $nav-svg-color;
- background-color: $color-alternate;
+ color: $navbar-theme-color;
+ background-color: $navbar-theme-contrast-color;
}
}
&.line-separator {
- border-left: 1px solid rgba($search-and-nav-links, 0.2);
+ border-left: 1px solid $search-and-nav-links-a20;
}
}
}
@@ -65,12 +69,12 @@
color: $search-and-nav-links;
&.header-search-new {
- color: $sidebar-text;
+ color: $gray-900;
}
> a {
.notification-dot {
- border: 2px solid $nav-svg-color;
+ border: 2px solid $navbar-theme-color;
}
&.header-help-dropdown-toggle {
@@ -88,7 +92,7 @@
&:hover,
&:focus {
@include media-breakpoint-up(sm) {
- background-color: rgba($search-and-nav-links, 0.2);
+ background-color: $search-and-nav-links-a20;
}
svg {
@@ -97,7 +101,7 @@
.notification-dot {
will-change: border-color, background-color;
- border-color: adjust-color($nav-svg-color, $red: 33, $green: 33, $blue: 33);
+ border-color: adjust-color($navbar-theme-color, $red: 33, $green: 33, $blue: 33);
}
&.header-help-dropdown-toggle .notification-dot {
@@ -108,12 +112,12 @@
&.active > a,
&.dropdown.show > a {
- color: $nav-svg-color;
- background-color: $color-alternate;
+ color: $navbar-theme-color;
+ background-color: $navbar-theme-contrast-color;
&:hover {
svg {
- fill: $nav-svg-color;
+ fill: $navbar-theme-color;
}
}
@@ -123,7 +127,7 @@
&.header-help-dropdown-toggle {
.notification-dot {
- background-color: $nav-svg-color;
+ background-color: $navbar-theme-color;
}
}
}
@@ -131,7 +135,7 @@
.impersonated-user,
.impersonated-user:hover {
svg {
- fill: $nav-svg-color;
+ fill: $navbar-theme-color;
}
}
}
@@ -142,30 +146,30 @@
> a {
&:hover,
&:focus {
- background-color: rgba($search-and-nav-links, 0.2);
+ background-color: $search-and-nav-links-a20;
}
}
}
.header-search {
- background-color: rgba($search-and-nav-links, 0.2) !important;
+ background-color: $search-and-nav-links-a20 !important;
border-radius: $border-radius-default;
&:hover {
- background-color: rgba($search-and-nav-links, 0.3) !important;
+ background-color: $search-and-nav-links-a30 !important;
}
svg.gl-search-box-by-type-search-icon {
- color: rgba($search-and-nav-links, 0.8);
+ color: $search-and-nav-links-a80;
}
input {
background-color: transparent;
- color: rgba($search-and-nav-links, 0.8);
- box-shadow: inset 0 0 0 1px rgba($search-and-nav-links, 0.4);
+ color: $search-and-nav-links-a80;
+ box-shadow: inset 0 0 0 1px $search-and-nav-links-a40;
&::placeholder {
- color: rgba($search-and-nav-links, 0.8);
+ color: $search-and-nav-links-a80;
}
&:focus,
@@ -178,27 +182,27 @@
.keyboard-shortcut-helper {
color: $search-and-nav-links;
- background-color: rgba($search-and-nav-links, 0.2);
+ background-color: $search-and-nav-links-a20;
}
}
.search {
form {
- background-color: rgba($search-and-nav-links, 0.2);
+ background-color: $search-and-nav-links-a20;
&:hover {
- background-color: rgba($search-and-nav-links, 0.3);
+ background-color: $search-and-nav-links-a30;
}
}
.search-input::placeholder {
- color: rgba($search-and-nav-links, 0.8);
+ color: $search-and-nav-links-a80;
}
.search-input-wrap {
.search-icon,
.clear-icon {
- fill: rgba($search-and-nav-links, 0.8);
+ fill: $search-and-nav-links-a80;
}
}
@@ -209,7 +213,7 @@
.search-input-wrap {
.search-icon {
- fill: rgba($search-and-nav-links, 0.8);
+ fill: $search-and-nav-links-a80;
}
}
}
@@ -217,7 +221,7 @@
// Sidebar
.nav-sidebar li.active > a {
- color: $sidebar-text;
+ color: $gray-900;
}
.nav-sidebar {
diff --git a/app/assets/stylesheets/themes/theme_indigo.scss b/app/assets/stylesheets/themes/theme_indigo.scss
index 3bf6cfea6500735baaa66001a5bd1e39d95853de..5a27a9cfdc5031e8c567613af3fd5dec7f030275 100644
--- a/app/assets/stylesheets/themes/theme_indigo.scss
+++ b/app/assets/stylesheets/themes/theme_indigo.scss
@@ -6,7 +6,6 @@ body {
$indigo-200,
$indigo-500,
$indigo-700,
- $gray-900,
$indigo-900,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_light_blue.scss b/app/assets/stylesheets/themes/theme_light_blue.scss
index 771a84911b3829cbd944809b71b2a385f1813f80..7cb0d98802ea2f3d6069b5c9fbfbf67b368fc8d0 100644
--- a/app/assets/stylesheets/themes/theme_light_blue.scss
+++ b/app/assets/stylesheets/themes/theme_light_blue.scss
@@ -6,7 +6,6 @@ body {
$theme-light-blue-200,
$theme-light-blue-500,
$theme-light-blue-500,
- $gray-900,
$theme-light-blue-700,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_light_gray.scss b/app/assets/stylesheets/themes/theme_light_gray.scss
index ad19438d79a835da14237186fc01f9fdf69ee658..a0cbec9a92b47f233bdb2c746b952529b770ccb0 100644
--- a/app/assets/stylesheets/themes/theme_light_gray.scss
+++ b/app/assets/stylesheets/themes/theme_light_gray.scss
@@ -6,7 +6,6 @@ body {
$gray-500,
$gray-700,
$gray-500,
- $gray-900,
$gray-50,
$gray-500
);
diff --git a/app/assets/stylesheets/themes/theme_light_green.scss b/app/assets/stylesheets/themes/theme_light_green.scss
index 8c991a7bfb3f25497598d5611ce42ae0e587e374..797279cc37b6ad749a24a14ebf4195b77787700a 100644
--- a/app/assets/stylesheets/themes/theme_light_green.scss
+++ b/app/assets/stylesheets/themes/theme_light_green.scss
@@ -6,7 +6,6 @@ body {
$theme-green-200,
$theme-green-500,
$theme-green-500,
- $gray-900,
$theme-light-green-700,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_light_indigo.scss b/app/assets/stylesheets/themes/theme_light_indigo.scss
index 6c220e0459a45dd04c4c7088d425f9ab89ee980f..3632c5ad45a95319bcdcfb5b7038000a05a83bd9 100644
--- a/app/assets/stylesheets/themes/theme_light_indigo.scss
+++ b/app/assets/stylesheets/themes/theme_light_indigo.scss
@@ -6,7 +6,6 @@ body {
$indigo-200,
$indigo-500,
$indigo-500,
- $gray-900,
$indigo-700,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_light_red.scss b/app/assets/stylesheets/themes/theme_light_red.scss
index e1a715293b400eb82595b62a21a510f1e5ed8d21..6c10d9178f190df00fb5cd6ffd38bd9efa2cbf29 100644
--- a/app/assets/stylesheets/themes/theme_light_red.scss
+++ b/app/assets/stylesheets/themes/theme_light_red.scss
@@ -6,7 +6,6 @@ body {
$theme-light-red-200,
$theme-light-red-500,
$theme-light-red-500,
- $gray-900,
$theme-light-red-700,
$white
);
diff --git a/app/assets/stylesheets/themes/theme_red.scss b/app/assets/stylesheets/themes/theme_red.scss
index 19fd150727dee7eb657b62b198f6bc45803ebde5..140e27de6e229a0b1c1c343ae1899b2953ae1c2d 100644
--- a/app/assets/stylesheets/themes/theme_red.scss
+++ b/app/assets/stylesheets/themes/theme_red.scss
@@ -6,7 +6,6 @@ body {
$theme-red-200,
$theme-red-500,
$theme-red-700,
- $gray-900,
$theme-red-900,
$white
);
diff --git a/ee/app/assets/stylesheets/startup/startup-dark.scss b/ee/app/assets/stylesheets/startup/startup-dark.scss
index 71c998832975712dc89ae5e9afd8bcc16602dcf0..9f2b249e714d38da4c9ef71e8cd881b007f78a49 100644
--- a/ee/app/assets/stylesheets/startup/startup-dark.scss
+++ b/ee/app/assets/stylesheets/startup/startup-dark.scss
@@ -10,7 +10,6 @@ body.gl-dark {
--gray-50: #303030;
--gray-100: #404040;
--gray-200: #525252;
- --gray-600: #bfbfbf;
--gray-700: #dbdbdb;
--gray-900: #fafafa;
--green-100: #0d532a;
@@ -1791,9 +1790,6 @@ body.gl-dark {
.avatar {
background: rgba(255, 255, 255, 0.04);
}
-.nav-sidebar li a {
- color: var(--gray-600);
-}
body.gl-dark {
--gl-theme-accent: #868686;
}