Commit 197a305b authored by Clement Ho's avatar Clement Ho

Merge branch '49807-consolidate-sass-variables' into 'master'

Reorganize variables.scss, Part 1

See merge request gitlab-org/gitlab-ce!21118
parents 3cd61fea a96b2b15
...@@ -14,7 +14,6 @@ $border-radius-base: 3px !default; ...@@ -14,7 +14,6 @@ $border-radius-base: 3px !default;
$modal-body-bg: $white-light; $modal-body-bg: $white-light;
$input-border: $border-color; $input-border: $border-color;
$input-border-focus: $focus-border-color;
$padding-base-vertical: $gl-vert-padding; $padding-base-vertical: $gl-vert-padding;
$padding-base-horizontal: $gl-padding; $padding-base-horizontal: $gl-padding;
......
@import 'framework/variables'; @import 'framework/variables';
@import 'framework/variables_overrides';
@import 'framework/mixins'; @import 'framework/mixins';
@import 'bootstrap'; @import 'bootstrap';
......
...@@ -350,7 +350,7 @@ ...@@ -350,7 +350,7 @@
&:focus { &:focus {
cursor: text; cursor: text;
box-shadow: none; box-shadow: none;
border-color: lighten($dropdown-input-focus-border, 20%); border-color: lighten($blue-300, 20%);
color: $gray-darkest; color: $gray-darkest;
background-color: $gray-light; background-color: $gray-light;
} }
......
...@@ -615,7 +615,7 @@ ...@@ -615,7 +615,7 @@
&:focus { &:focus {
color: $dropdown-link-color; color: $dropdown-link-color;
border-color: $dropdown-input-focus-border; border-color: $blue-300;
box-shadow: 0 0 4px $dropdown-input-focus-shadow; box-shadow: 0 0 4px $dropdown-input-focus-shadow;
~ .fa { ~ .fa {
......
...@@ -205,7 +205,7 @@ ...@@ -205,7 +205,7 @@
&.focus, &.focus,
&.focus:hover { &.focus:hover {
border-color: $dropdown-input-focus-border; border-color: $blue-300;
box-shadow: 0 0 4px $search-input-focus-shadow-color; box-shadow: 0 0 4px $search-input-focus-shadow-color;
} }
...@@ -294,7 +294,7 @@ ...@@ -294,7 +294,7 @@
&:hover, &:hover,
&:focus { &:focus {
color: $gl-text-color; color: $gl-text-color;
border-color: $dropdown-input-focus-border; border-color: $blue-300;
outline: none; outline: none;
} }
......
...@@ -153,7 +153,7 @@ ...@@ -153,7 +153,7 @@
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
&:focus { &:focus {
border-color: $input-border-focus; border-color: $blue-300;
} }
&.select2-active { &.select2-active {
......
...@@ -177,7 +177,6 @@ $border-gray-dark: darken($white-normal, $darken-border-factor); ...@@ -177,7 +177,6 @@ $border-gray-dark: darken($white-normal, $darken-border-factor);
* UI elements * UI elements
*/ */
$border-color: #e5e5e5; $border-color: #e5e5e5;
$focus-border-color: $blue-300;
$well-expand-item: #e8f2f7; $well-expand-item: #e8f2f7;
$well-inner-border: #eef0f2; $well-inner-border: #eef0f2;
$well-light-border: #f1f1f1; $well-light-border: #f1f1f1;
...@@ -392,8 +391,7 @@ $dropdown-divider-color: rgba(#000, 0.1); ...@@ -392,8 +391,7 @@ $dropdown-divider-color: rgba(#000, 0.1);
$dropdown-title-btn-color: #bfbfbf; $dropdown-title-btn-color: #bfbfbf;
$dropdown-input-color: #555; $dropdown-input-color: #555;
$dropdown-input-fa-color: #c7c7c7; $dropdown-input-fa-color: #c7c7c7;
$dropdown-input-focus-border: $focus-border-color; $dropdown-input-focus-shadow: rgba($blue-300, 0.4);
$dropdown-input-focus-shadow: rgba($dropdown-input-focus-border, 0.4);
$dropdown-loading-bg: rgba(#fff, 0.6); $dropdown-loading-bg: rgba(#fff, 0.6);
$dropdown-chevron-size: 10px; $dropdown-chevron-size: 10px;
$dropdown-toggle-active-border-color: darken($border-color, 14%); $dropdown-toggle-active-border-color: darken($border-color, 14%);
...@@ -834,19 +832,3 @@ Prometheus ...@@ -834,19 +832,3 @@ Prometheus
$prometheus-table-row-highlight-color: $theme-gray-100; $prometheus-table-row-highlight-color: $theme-gray-100;
$priority-label-empty-state-width: 114px; $priority-label-empty-state-width: 114px;
/*
* Override Bootstrap 4 variables
*/
$secondary: $gray-light;
$input-disabled-bg: $gray-light;
$input-border-color: $theme-gray-200;
$input-color: $gl-text-color;
$font-family-sans-serif: $regular-font;
$font-family-monospace: $monospace-font;
$input-line-height: 20px;
$btn-line-height: 20px;
$table-accent-bg: $gray-light;
$card-border-color: $border-color;
$card-cap-bg: $gray-light;
/*
* This file is only for overriding Bootstrap 4 variables.
* Please add any new variables to variables.scss
*/
$secondary: $gray-light;
$input-disabled-bg: $gray-light;
$input-border-color: $theme-gray-200;
$input-color: $gl-text-color;
$font-family-sans-serif: $regular-font;
$font-family-monospace: $monospace-font;
$input-line-height: 20px;
$btn-line-height: 20px;
$table-accent-bg: $gray-light;
$card-border-color: $border-color;
$card-cap-bg: $gray-light;
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
.comment-toolbar, .comment-toolbar,
.nav-links { .nav-links {
border-color: $focus-border-color; border-color: $blue-300;
} }
} }
......
...@@ -23,7 +23,7 @@ $search-avatar-size: 16px; ...@@ -23,7 +23,7 @@ $search-avatar-size: 16px;
.search-text-input:hover, .search-text-input:hover,
.form-control:hover, .form-control:hover,
:not[readonly] { :not[readonly] {
border-color: lighten($dropdown-input-focus-border, 20%); border-color: lighten($blue-300, 20%);
box-shadow: 0 0 4px lighten($search-input-focus-shadow-color, 20%); box-shadow: 0 0 4px lighten($search-input-focus-shadow-color, 20%);
} }
...@@ -127,7 +127,7 @@ input[type='checkbox']:hover { ...@@ -127,7 +127,7 @@ input[type='checkbox']:hover {
&.search-active { &.search-active {
form { form {
@extend .form-control:focus; @extend .form-control:focus;
border-color: $dropdown-input-focus-border; border-color: $blue-300;
box-shadow: none; box-shadow: none;
@include media-breakpoint-up(xl) { @include media-breakpoint-up(xl) {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment