diff options
Diffstat (limited to 'app/assets/stylesheets/framework/gitlab_theme.scss')
-rw-r--r-- | app/assets/stylesheets/framework/gitlab_theme.scss | 431 |
1 files changed, 0 insertions, 431 deletions
diff --git a/app/assets/stylesheets/framework/gitlab_theme.scss b/app/assets/stylesheets/framework/gitlab_theme.scss deleted file mode 100644 index 97bd6ca6fe2..00000000000 --- a/app/assets/stylesheets/framework/gitlab_theme.scss +++ /dev/null @@ -1,431 +0,0 @@ -/** - * Styles the GitLab application with a specific color theme - */ - -@mixin gitlab-theme( - $search-and-nav-links, - $active-tab-border, - $border-and-box-shadow, - $sidebar-text, - $nav-svg-color, - $color-alternate -) { - // Header - - .navbar-gitlab { - background-color: $nav-svg-color; - - .navbar-collapse { - color: $search-and-nav-links; - } - - .container-fluid { - .navbar-toggler { - border-left: 1px solid lighten($border-and-box-shadow, 10%); - - svg { - fill: $search-and-nav-links; - } - } - } - - .navbar-sub-nav, - .navbar-nav { - > li { - > a, - > button { - &:hover, - &:focus { - background-color: rgba($search-and-nav-links, 0.2); - } - } - - &.active, - &.dropdown.show { - > a, - > button { - color: $nav-svg-color; - background-color: $color-alternate; - } - } - - &.line-separator { - border-left: 1px solid rgba($search-and-nav-links, 0.2); - } - } - } - - .navbar-sub-nav { - color: $search-and-nav-links; - } - - .nav { - > li { - color: $search-and-nav-links; - - > a { - &.header-user-dropdown-toggle { - .header-user-avatar { - border-color: $search-and-nav-links; - } - - .header-user-notification-dot { - border: 2px solid $nav-svg-color; - } - } - - &:hover, - &:focus { - @include media-breakpoint-up(sm) { - background-color: rgba($search-and-nav-links, 0.2); - } - - svg { - fill: currentColor; - } - - &.header-user-dropdown-toggle .header-user-notification-dot { - border-color: $nav-svg-color + 33; - } - } - } - - &.active > a, - &.dropdown.show > a { - color: $nav-svg-color; - background-color: $color-alternate; - - &:hover { - svg { - fill: $nav-svg-color; - } - } - - &.header-user-dropdown-toggle .header-user-notification-dot { - border-color: $white; - } - } - - .impersonated-user, - .impersonated-user:hover { - svg { - fill: $nav-svg-color; - } - } - } - } - } - - .navbar .title { - > a { - &:hover, - &:focus { - background-color: rgba($search-and-nav-links, 0.2); - } - } - } - - .search { - form { - background-color: rgba($search-and-nav-links, 0.2); - - &:hover { - background-color: rgba($search-and-nav-links, 0.3); - } - } - - .search-input::placeholder { - color: rgba($search-and-nav-links, 0.8); - } - - .search-input-wrap { - .search-icon, - .clear-icon { - fill: rgba($search-and-nav-links, 0.8); - } - } - - &.search-active { - form { - background-color: $white; - } - - .search-input-wrap { - .search-icon { - fill: rgba($search-and-nav-links, 0.8); - } - } - } - } - - // Sidebar - .nav-sidebar li.active { - box-shadow: inset 4px 0 0 $border-and-box-shadow; - - > a { - color: $sidebar-text; - } - - .nav-icon-container svg { - fill: $sidebar-text; - } - } - - .sidebar-top-level-items > li.active .badge.badge-pill { - color: $sidebar-text; - } - - .nav-links li { - &.active a, - &.md-header-tab.active button, - a.active { - border-bottom: 2px solid $active-tab-border; - - .badge.badge-pill { - font-weight: $gl-font-weight-bold; - } - } - } - - .branch-header-title { - color: $border-and-box-shadow; - } - - .ide-sidebar-link { - &.active { - color: $border-and-box-shadow; - box-shadow: inset 3px 0 $border-and-box-shadow; - - &.is-right { - box-shadow: inset -3px 0 $border-and-box-shadow; - } - } - } -} - -body { - &.ui-indigo { - @include gitlab-theme( - $indigo-200, - $indigo-500, - $indigo-700, - $indigo-800, - $indigo-900, - $white - ); - } - - &.ui-light-indigo { - @include gitlab-theme( - $indigo-200, - $indigo-500, - $indigo-500, - $indigo-700, - $indigo-700, - $white - ); - } - - &.ui-blue { - @include gitlab-theme( - $theme-blue-200, - $theme-blue-500, - $theme-blue-700, - $theme-blue-800, - $theme-blue-900, - $white - ); - } - - &.ui-light-blue { - @include gitlab-theme( - $theme-light-blue-200, - $theme-light-blue-500, - $theme-light-blue-500, - $theme-light-blue-700, - $theme-light-blue-700, - $white - ); - } - - &.ui-green { - @include gitlab-theme( - $theme-green-200, - $theme-green-500, - $theme-green-700, - $theme-green-800, - $theme-green-900, - $white - ); - } - - &.ui-light-green { - @include gitlab-theme( - $theme-green-200, - $theme-green-500, - $theme-green-500, - $theme-light-green-700, - $theme-light-green-700, - $white - ); - } - - &.ui-red { - @include gitlab-theme( - $theme-red-200, - $theme-red-500, - $theme-red-700, - $theme-red-800, - $theme-red-900, - $white - ); - } - - &.ui-light-red { - @include gitlab-theme( - $theme-light-red-200, - $theme-light-red-500, - $theme-light-red-500, - $theme-light-red-700, - $theme-light-red-700, - $white - ); - } - - &.ui-dark { - @include gitlab-theme( - $gray-200, - $gray-300, - $gray-500, - $gray-700, - $gray-900, - $white - ); - } - - &.ui-light { - @include gitlab-theme( - $gray-500, - $gray-700, - $gray-500, - $gray-500, - $gray-50, - $gray-500 - ); - - .navbar-gitlab { - background-color: $gray-50; - box-shadow: 0 1px 0 0 $border-color; - - .logo-text svg { - fill: $gray-900; - } - - .navbar-sub-nav, - .navbar-nav { - > li { - > a:hover, - > a:focus, - > button:hover { - color: $gray-900; - } - - &.active > a, - &.active > a:hover, - &.active > button { - color: $white; - } - } - } - - .container-fluid { - .navbar-toggler, - .navbar-toggler:hover { - color: $gray-500; - border-left: 1px solid $gray-100; - } - } - } - - .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; - } - } - - &.gl-dark { - .logo-text svg { - fill: $gl-text-color; - } - - .navbar-gitlab { - background-color: $gray-50; - - .navbar-sub-nav, - .navbar-nav { - li { - > a:hover, - > a:focus, - > button:hover, - > button:focus { - color: $gl-text-color; - background-color: $gray-200; - } - } - - li.active, - li.dropdown.show { - > a, - > button { - color: $gl-text-color; - background-color: $gray-200; - } - } - } - - .search { - form { - background-color: $gray-100; - box-shadow: inset 0 0 0 1px $border-color; - - &:active, - &:hover { - background-color: $gray-100; - box-shadow: inset 0 0 0 1px $blue-200; - } - } - } - } - } -} |