diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-09-20 02:18:09 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-09-20 02:18:09 +0300 |
commit | 6ed4ec3e0b1340f96b7c043ef51d1b33bbe85fde (patch) | |
tree | dc4d20fe6064752c0bd323187252c77e0a89144b /app/assets/stylesheets/themes/theme_helper.scss | |
parent | 9868dae7fc0655bd7ce4a6887d4e6d487690eeed (diff) |
Add latest changes from gitlab-org/gitlab@15-4-stable-eev15.4.0-rc42
Diffstat (limited to 'app/assets/stylesheets/themes/theme_helper.scss')
-rw-r--r-- | app/assets/stylesheets/themes/theme_helper.scss | 66 |
1 files changed, 35 insertions, 31 deletions
diff --git a/app/assets/stylesheets/themes/theme_helper.scss b/app/assets/stylesheets/themes/theme_helper.scss index 042e21cebd6..d644d8acc98 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 { |