diff options
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/stylesheets/framework.scss | 2 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/gitlab-theme.scss | 21 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/variables.scss | 38 | ||||
-rw-r--r-- | app/assets/stylesheets/new_nav.scss | 26 |
4 files changed, 58 insertions, 29 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; - } - } } } |