Commit def895c5 authored by Clement Ho's avatar Clement Ho 🔴

Merge branch 'remove-scss-variables-4' into 'master'

Remove another batch of reassigned scss variables

See merge request gitlab-org/gitlab-ce!21334
parents 382b6dab 0c8eae0f
Pipeline #28391925 passed with stages
in 57 minutes and 56 seconds
......@@ -4,11 +4,11 @@
$text-color: $gl-text-color;
$brand-primary: $gl-primary;
$brand-success: $gl-success;
$brand-info: $gl-info;
$brand-warning: $gl-warning;
$brand-danger: $gl-danger;
$brand-primary: $blue-500;
$brand-success: $green-500;
$brand-info: $blue-500;
$brand-warning: $orange-500;
$brand-danger: $red-500;
$border-radius-base: 3px !default;
......
......@@ -8,7 +8,7 @@
float: left;
margin-right: 15px;
border-radius: $avatar-radius;
border: 1px solid $avatar-border;
border: 1px solid $gray-normal;
&.s16 { @include avatar-size(16px, 6px); }
&.s18 { @include avatar-size(18px, 6px); }
&.s19 { @include avatar-size(19px, 6px); }
......@@ -36,7 +36,7 @@
width: 40px;
height: 40px;
padding: 0;
background: $avatar-background;
background: $gray-lightest;
overflow: hidden;
&.avatar-inline {
......@@ -62,7 +62,7 @@
}
&:not([href]):hover {
border-color: darken($avatar-border, 10%);
border-color: darken($gray-normal, 10%);
}
}
......@@ -70,7 +70,7 @@
text-align: center;
vertical-align: top;
color: $identicon-fg-color;
background-color: $identicon-gray;
background-color: $gray-darker;
// Sizes
&.s16 { font-size: 12px; line-height: 1.33; }
......@@ -94,7 +94,7 @@
&.bg4 { background-color: $identicon-blue; }
&.bg5 { background-color: $identicon-teal; }
&.bg6 { background-color: $identicon-orange; }
&.bg7 { background-color: $identicon-gray; }
&.bg7 { background-color: $gray-darker; }
}
.avatar-container {
......@@ -122,7 +122,7 @@
.avatar-counter {
background-color: $gray-darkest;
color: $white-light;
border: 1px solid $avatar-border;
border: 1px solid $gray-normal;
border-radius: 1em;
font-family: $regular-font;
font-size: 9px;
......
.badge.badge-pill {
font-weight: $gl-font-weight-normal;
background-color: $badge-bg;
color: $badge-color;
color: $gl-text-color-secondary;
vertical-align: baseline;
}
......@@ -452,14 +452,14 @@
}
.btn-missing {
color: $notes-light-color;
color: $gl-text-color-secondary;
border: 1px dashed $border-gray-normal-dashed;
border-radius: $border-radius-default;
&:hover,
&:active,
&:focus {
color: $notes-light-color;
color: $gl-text-color-secondary;
background-color: $white-normal;
}
}
......
......@@ -352,7 +352,7 @@ img.emoji {
border-color: $border-color !important;
.dz-upload {
background: $gl-success !important;
background: $green-500 !important;
}
}
......
......@@ -206,7 +206,7 @@
&.focus,
&.focus:hover {
border-color: $blue-300;
box-shadow: 0 0 4px $search-input-focus-shadow-color;
box-shadow: 0 0 4px $dropdown-input-focus-shadow;
}
gl-emoji {
......
......@@ -554,7 +554,7 @@
float: left;
margin-right: 5px;
border-radius: 50%;
border: 1px solid $avatar-border;
border: 1px solid $gray-normal;
}
.with-performance-bar .navbar-gitlab {
......
......@@ -11,7 +11,7 @@
.ci-status-icon-failed {
svg {
fill: $gl-danger;
fill: $red-500;
}
&.add-border {
......
......@@ -26,12 +26,12 @@
&.status-box-closed,
&.status-box-mr-closed {
background-color: $gl-danger;
background-color: $red-500;
}
&.status-box-issue-closed,
&.status-box-mr-merged {
background-color: $gl-primary;
background-color: $blue-500;
}
&.status-box-open {
......
......@@ -297,19 +297,9 @@ $tanuki-yellow: #fca326;
/*
* State colors:
*/
$gl-primary: $blue-500;
$gl-success: $green-500;
$gl-success-focus: rgba($gl-success, 0.4);
$gl-info: $blue-500;
$gl-warning: $orange-500;
$gl-danger: $red-500;
$green-500-focus: rgba($green-500, 0.4);
$gl-btn-active-background: rgba(0, 0, 0, 0.16);
$gl-btn-active-gradient: inset 0 2px 3px $gl-btn-active-background;
// Bootstrap override states
$success: $gl-success;
$info: $gl-info;
$warning: $gl-warning;
$danger: $gl-danger;
/*
* Commit Diff Colors
......@@ -330,9 +320,9 @@ $dark-diff-match-bg: rgba(255, 255, 255, 0.3);
$dark-diff-match-color: rgba(255, 255, 255, 0.1);
$file-mode-changed: #777;
$file-mode-changed: #777;
$diff-image-info-color: grey;
$diff-image-info-color: gray;
$diff-swipe-border: #999;
$diff-view-modes-color: grey;
$diff-view-modes-color: gray;
$diff-view-modes-border: #c1c1c1;
$diff-jagged-border-gradient-color: darken($white-normal, 8%);
......@@ -372,7 +362,6 @@ $dropdown-member-form-control-width: 163px;
* Filtered Search
*/
$filtered-search-term-shadow-color: rgba(0, 0, 0, 0.09);
$dropdown-hover-color: $blue-400;
/*
* Contextual Sidebar
......@@ -387,7 +376,7 @@ $sidebar-milestone-toggle-bottom-margin: 10px;
* Buttons
*/
$btn-active-gray: #ececec;
$btn-active-gray-light: e4e7ed;
$btn-active-gray-light: #e4e7ed;
$btn-white-active: #848484;
$gl-btn-padding: 10px;
$gl-btn-line-height: 16px;
......@@ -398,7 +387,6 @@ $gl-btn-horz-padding: 12px;
* Badges
*/
$badge-bg: rgba(0, 0, 0, 0.07);
$badge-color: $gl-text-color-secondary;
/*
* Pagination
......@@ -406,21 +394,12 @@ $badge-color: $gl-text-color-secondary;
$pagination-padding-y: 6px;
$pagination-padding-x: 16px;
$pagination-line-height: 20px;
$pagination-border-color: $border-color;
$pagination-active-bg: $blue-600;
$pagination-active-border-color: $blue-600;
$pagination-hover-bg: $blue-50;
$pagination-hover-border-color: $border-color;
$pagination-hover-color: $gl-text-color;
$pagination-disabled-color: #cdcdcd;
$pagination-disabled-bg: $gray-light;
$pagination-disabled-border-color: $border-color;
/*
* Status icons
*/
$status-icon-size: 22px;
$status-icon-margin: $gl-btn-padding;
/*
* Award emoji
......@@ -433,16 +412,13 @@ $award-emoji-positive-add-lines: #bb9c13;
* Search Box
*/
$search-input-border-color: rgba($blue-400, 0.8);
$search-input-focus-shadow-color: $dropdown-input-focus-shadow;
$search-input-width: 240px;
$search-input-active-width: 320px;
$location-badge-active-bg: $blue-500;
$location-icon-color: #e7e9ed;
/*
* Notes
*/
$notes-light-color: $gl-text-color-secondary;
$note-disabled-comment-color: #b2b2b2;
$note-targe3-outside: #fffff0;
$note-targe3-inside: #ffffd3;
......@@ -463,7 +439,6 @@ $identicon-indigo: #e8eaf6;
$identicon-blue: #e3f2fd;
$identicon-teal: #e0f2f1;
$identicon-orange: #fbe9e7;
$identicon-gray: $gray-darker;
$identicon-fg-color: #555555;
/*
......@@ -479,7 +454,6 @@ $calendar-user-contrib-text: #959494;
$cycle-analytics-box-padding: 30px;
$cycle-analytics-box-text-color: #8c8c8c;
$cycle-analytics-big-font: 19px;
$cycle-analytics-dark-text: $gl-text-color;
$cycle-analytics-light-gray: #bfbfbf;
$cycle-analytics-dismiss-icon-color: #b2b2b2;
......@@ -507,9 +481,6 @@ $issue-board-list-difference-md: $issue-board-list-difference-sm + $issue-boards
* Avatar
*/
$avatar-radius: 50%;
$avatar-border: $gray-normal;
$avatar-border-hover: $gray-darker;
$avatar-background: $gray-lightest;
$gl-avatar-size: 40px;
/*
......
......@@ -14,3 +14,7 @@ $btn-line-height: 20px;
$table-accent-bg: $gray-light;
$card-border-color: $border-color;
$card-cap-bg: $gray-light;
$success: $green-500;
$info: $blue-500;
$warning: $orange-500;
$danger: $red-500;
......@@ -285,7 +285,7 @@
.total-time {
font-size: $cycle-analytics-big-font;
color: $cycle-analytics-dark-text;
color: $gl-text-color;
span {
color: $gl-text-color;
......
......@@ -144,7 +144,7 @@
color: $blue-800;
.avatar {
border-color: rgba($avatar-border, .2);
border-color: rgba($gray-normal, .2);
}
}
......@@ -231,7 +231,7 @@
}
a.edit-link:not([href]):hover {
color: rgba($avatar-border, .2);
color: rgba($gray-normal, .2);
}
.lock-edit, // uses same style, different js behaviour
......
......@@ -67,7 +67,7 @@
.dropdown-labels-error {
padding: 5px 10px;
margin-bottom: 10px;
background-color: $gl-danger;
background-color: $red-500;
color: $white-light;
}
......@@ -117,7 +117,7 @@
color: $blue-600;
&.remove-row {
color: $gl-danger;
color: $red-500;
}
}
}
......
......@@ -200,7 +200,7 @@
.mr-widget-icon {
font-size: 22px;
margin-right: $status-icon-margin;
margin-right: $gl-btn-padding;
}
.ci-status-icon svg {
......@@ -281,7 +281,7 @@
margin-bottom: 0;
&.has-conflicts .fa-exclamation-triangle {
color: $gl-warning;
color: $orange-500;
}
time {
......@@ -313,7 +313,7 @@
}
.danger {
color: $gl-danger;
color: $red-500;
}
.spacing,
......@@ -514,7 +514,7 @@
}
.mr-links {
padding-left: $status-icon-size + $status-icon-margin;
padding-left: $status-icon-size + $gl-btn-padding;
}
.mr-info-list {
......
......@@ -74,13 +74,13 @@
}
&.is-dropzone-hover {
border-color: $gl-success;
border-color: $green-500;
box-shadow: 0 0 2px $black-transparent,
0 0 4px $gl-success-focus;
0 0 4px $green-500-focus;
.comment-toolbar,
.nav-links {
border-color: $gl-success;
border-color: $green-500;
}
}
}
......
......@@ -443,7 +443,7 @@ ul.notes {
.note-headline-light,
.discussion-headline-light {
color: $notes-light-color;
color: $gl-text-color-secondary;
}
.discussion-headline-light {
......
......@@ -394,23 +394,23 @@
}
.vs-public {
color: $gl-primary;
color: $blue-500;
}
.vs-internal {
color: $gl-warning;
color: $orange-500;
}
.vs-private {
color: $gl-success;
color: $green-500;
}
.lfs-enabled {
color: $gl-success;
color: $green-500;
}
.lfs-disabled {
color: $gl-warning;
color: $orange-500;
}
.breadcrumb.repo-breadcrumb {
......@@ -731,7 +731,7 @@
background-color: transparent;
font-size: $gl-font-size;
line-height: $gl-btn-line-height;
color: $notes-light-color;
color: $gl-text-color-secondary;
}
.stat-link {
......
......@@ -24,12 +24,12 @@ $search-avatar-size: 16px;
.form-control:hover,
:not[readonly] {
border-color: lighten($blue-300, 20%);
box-shadow: 0 0 4px lighten($search-input-focus-shadow-color, 20%);
box-shadow: 0 0 4px lighten($dropdown-input-focus-shadow, 20%);
}
input[type='checkbox']:hover {
box-shadow: 0 0 2px 2px lighten($search-input-focus-shadow-color, 20%),
0 0 0 1px lighten($search-input-focus-shadow-color, 20%);
box-shadow: 0 0 2px 2px lighten($dropdown-input-focus-shadow, 20%),
0 0 0 1px lighten($dropdown-input-focus-shadow, 20%);
}
.search {
......@@ -181,7 +181,7 @@ input[type='checkbox']:hover {
width: $search-avatar-size;
height: $search-avatar-size;
border-radius: 50%;
border: 1px solid $avatar-border;
border: 1px solid $gray-normal;
}
}
......
......@@ -120,11 +120,11 @@
}
.warning-title {
color: $gl-warning;
color: $orange-500;
}
.danger-title {
color: $gl-danger;
color: $red-500;
}
.integration-settings-form {
......
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