Commit 35f494bc authored by Jeremy Elder's avatar Jeremy Elder Committed by Andrew Fontaine

Update $gray-700 hex and replace instances

Update gray-700 hex value and find and replace all gray-700
with gray-500.
parent 6d59e61c
......@@ -273,7 +273,7 @@ export default {
<gl-loading-icon v-if="isUpdating" :inline="true" />
<p v-else-if="!isDropdownShowing" class="value gl-m-0" :class="{ 'no-value': !userName }">
<span v-if="userName" class="gl-text-gray-700" data-testid="assigned-users">{{
<span v-if="userName" class="gl-text-gray-500" data-testid="assigned-users">{{
assignedUser
}}</span>
<span v-else class="gl-display-flex gl-align-items-center">
......
......@@ -107,7 +107,7 @@ export default {
>
<span
v-if="$options.statuses[alert.status]"
class="gl-text-gray-700"
class="gl-text-gray-500"
data-testid="status"
>{{ $options.statuses[alert.status] }}</span
>
......
......@@ -241,7 +241,7 @@ export default {
v-if="isSwimlanesHeader && !list.isExpanded"
ref="collapsedInfo"
aria-hidden="true"
class="board-header-collapsed-info-icon gl-mt-2 gl-cursor-pointer gl-text-gray-700"
class="board-header-collapsed-info-icon gl-mt-2 gl-cursor-pointer gl-text-gray-500"
>
<gl-icon name="information" />
</span>
......
......@@ -230,10 +230,10 @@ export default {
</button>
</template>
<template v-if="discussion.resolved" #resolvedStatus>
<p class="gl-text-gray-700 gl-font-sm gl-m-0 gl-mt-5" data-testid="resolved-message">
<p class="gl-text-gray-500 gl-font-sm gl-m-0 gl-mt-5" data-testid="resolved-message">
{{ __('Resolved by') }}
<gl-link
class="gl-text-gray-700 gl-text-decoration-none gl-font-sm link-inherit-color"
class="gl-text-gray-500 gl-text-decoration-none gl-font-sm link-inherit-color"
:href="discussion.resolvedBy.webUrl"
target="_blank"
>{{ discussion.resolvedBy.name }}</gl-link
......
......@@ -52,7 +52,7 @@ export default {
{{ toggleText }}
</gl-button>
<template v-if="collapsed">
<span class="gl-text-gray-700">{{ __('Last reply by') }}</span>
<span class="gl-text-gray-500">{{ __('Last reply by') }}</span>
<gl-link
:href="lastReply.author.webUrl"
target="_blank"
......@@ -63,7 +63,7 @@ export default {
<time-ago-tooltip
:time="lastReply.createdAt"
tooltip-placement="bottom"
class="gl-text-gray-700"
class="gl-text-gray-500"
/>
</template>
</li>
......
......@@ -36,7 +36,7 @@ export default {
iconStyles() {
return {
size: this.hasDesigns ? 24 : 16,
class: this.hasDesigns ? 'gl-mb-2' : 'gl-mr-3 gl-text-gray-700',
class: this.hasDesigns ? 'gl-mb-2' : 'gl-mr-3 gl-text-gray-500',
};
},
},
......
......@@ -230,10 +230,10 @@ export default {
</button>
</template>
<template v-if="discussion.resolved" #resolvedStatus>
<p class="gl-text-gray-700 gl-font-sm gl-m-0 gl-mt-5" data-testid="resolved-message">
<p class="gl-text-gray-500 gl-font-sm gl-m-0 gl-mt-5" data-testid="resolved-message">
{{ __('Resolved by') }}
<gl-link
class="gl-text-gray-700 gl-text-decoration-none gl-font-sm link-inherit-color"
class="gl-text-gray-500 gl-text-decoration-none gl-font-sm link-inherit-color"
:href="discussion.resolvedBy.webUrl"
target="_blank"
>{{ discussion.resolvedBy.name }}</gl-link
......
......@@ -52,7 +52,7 @@ export default {
{{ toggleText }}
</gl-button>
<template v-if="collapsed">
<span class="gl-text-gray-700">{{ __('Last reply by') }}</span>
<span class="gl-text-gray-500">{{ __('Last reply by') }}</span>
<gl-link
:href="lastReply.author.webUrl"
target="_blank"
......@@ -63,7 +63,7 @@ export default {
<time-ago-tooltip
:time="lastReply.createdAt"
tooltip-placement="bottom"
class="gl-text-gray-700"
class="gl-text-gray-500"
/>
</template>
</li>
......
......@@ -148,7 +148,7 @@ export default {
<template>
<div class="content discussion-form discussion-form-container discussion-notes">
<div v-if="glFeatures.multilineComments" class="gl-mb-3 gl-text-gray-700 gl-pb-3">
<div v-if="glFeatures.multilineComments" class="gl-mb-3 gl-text-gray-500 gl-pb-3">
<multiline-comment-form
v-model="commentLineStart"
:line="line"
......
......@@ -53,7 +53,7 @@ export default {
:aria-label="leaveBtnTitle"
data-container="body"
data-placement="bottom"
class="leave-group btn btn-xs no-expand gl-text-gray-700 gl-ml-5"
class="leave-group btn btn-xs no-expand gl-text-gray-500 gl-ml-5"
@click.prevent="onLeaveGroup"
>
<icon name="leave" class="position-top-0" />
......@@ -66,7 +66,7 @@ export default {
:aria-label="editBtnTitle"
data-container="body"
data-placement="bottom"
class="edit-group btn btn-xs no-expand gl-text-gray-700 gl-ml-5"
class="edit-group btn btn-xs no-expand gl-text-gray-500 gl-ml-5"
>
<icon name="settings" class="position-top-0 align-middle" />
</a>
......
......@@ -44,7 +44,7 @@ export default {
</script>
<template>
<div class="stats gl-text-gray-700">
<div class="stats gl-text-gray-500">
<item-stats-value
v-if="isGroup"
:title="__('Subgroups')"
......
......@@ -23,7 +23,7 @@ export default {
class="gl-mb-1 gl-mr-5 gl-display-flex gl-display-sm-block gl-hover-text-blue-600-children gl-word-break-all"
>
<gl-link :href="link.url" class="gl-text-gray-900 gl-text-decoration-none!"
><gl-icon name="link" class="gl-text-gray-700 gl-vertical-align-text-bottom gl-mr-2" />{{
><gl-icon name="link" class="gl-text-gray-500 gl-vertical-align-text-bottom gl-mr-2" />{{
link.title
}}
</gl-link>
......
......@@ -347,7 +347,7 @@ export default {
<div
v-if="showMultiLineComment"
data-testid="multiline-comment"
class="gl-mb-3 gl-text-gray-700 gl-border-gray-200 gl-border-b-solid gl-border-b-1 gl-pb-3"
class="gl-mb-3 gl-text-gray-500 gl-border-gray-200 gl-border-b-solid gl-border-b-1 gl-pb-3"
>
<gl-sprintf :message="__('Comment on lines %{startLine} to %{endLine}')">
<template #startLine>
......
......@@ -51,7 +51,7 @@ export default {
{{ packageEntity.name }}
</h1>
<div class="gl-display-flex gl-align-items-center gl-text-gray-700">
<div class="gl-display-flex gl-align-items-center gl-text-gray-500">
<gl-icon name="eye" class="gl-mr-3" />
<gl-sprintf :message="$options.i18n.packageInfo">
<template #version>
......@@ -70,7 +70,7 @@ export default {
<div class="gl-display-flex gl-flex-wrap gl-align-items-center gl-mb-3">
<div v-if="packageTypeDisplay" class="gl-display-flex gl-align-items-center gl-mr-5">
<gl-icon name="package" class="gl-text-gray-700 gl-mr-3" />
<gl-icon name="package" class="gl-text-gray-500 gl-mr-3" />
<span data-testid="package-type" class="gl-font-weight-bold">{{ packageTypeDisplay }}</span>
</div>
......@@ -79,7 +79,7 @@ export default {
</div>
<div v-if="packagePipeline" class="gl-display-flex gl-align-items-center gl-mr-5">
<gl-icon name="review-list" class="gl-text-gray-700 gl-mr-3" />
<gl-icon name="review-list" class="gl-text-gray-500 gl-mr-3" />
<gl-link
data-testid="pipeline-project"
:href="packagePipeline.project.web_url"
......@@ -94,7 +94,7 @@ export default {
data-testid="package-ref"
class="gl-display-flex gl-align-items-center gl-mr-5"
>
<gl-icon name="branch" class="gl-text-gray-700 gl-mr-3" />
<gl-icon name="branch" class="gl-text-gray-500 gl-mr-3" />
<span
v-gl-tooltip
class="gl-font-weight-bold text-truncate mw-xs"
......@@ -104,7 +104,7 @@ export default {
</div>
<div class="gl-display-flex gl-align-items-center gl-mr-5">
<gl-icon name="disk" class="gl-text-gray-700 gl-mr-3" />
<gl-icon name="disk" class="gl-text-gray-500 gl-mr-3" />
<span data-testid="package-size" class="gl-font-weight-bold">{{ totalSize }}</span>
</div>
</div>
......
......@@ -70,7 +70,7 @@ export default {
<template>
<div class="gl-display-flex gl-align-items-center">
<div v-if="!hideLabel" data-testid="tagLabel" class="gl-display-flex gl-align-items-center">
<gl-icon name="labels" class="gl-text-gray-700 gl-mr-3" />
<gl-icon name="labels" class="gl-text-gray-500 gl-mr-3" />
<span class="gl-font-weight-bold">{{ tagsDisplay }}</span>
</div>
......
......@@ -96,7 +96,7 @@ export default {
</div>
<div
v-if="imagesCount"
class="gl-display-flex gl-align-items-center gl-mt-1 gl-mb-3 gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-mt-1 gl-mb-3 gl-text-gray-500"
data-testid="subheader"
>
<span class="gl-mr-3" data-testid="images-count">
......
......@@ -45,7 +45,7 @@ export default {
data-testid="close"
@click="dismiss"
>
<gl-icon name="close" aria-hidden="true" class="gl-text-gray-700" />
<gl-icon name="close" aria-hidden="true" class="gl-text-gray-500" />
</button>
</div>
</div>
......
......@@ -250,7 +250,7 @@ export default {
</gl-mentions>
<slot v-else name="textarea"></slot>
<a
class="zen-control zen-control-leave js-zen-leave gl-text-gray-700"
class="zen-control zen-control-leave js-zen-leave gl-text-gray-500"
href="#"
:aria-label="__('Leave zen mode')"
>
......
......@@ -78,7 +78,7 @@ export default {
<span class="dropdown-toggle-text"> {{ dropdownToggleText }} </span>
<gl-icon
name="chevron-down"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-700"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-500"
:size="16"
/>
</button>
......
......@@ -22,7 +22,7 @@ export default {
/>
<gl-icon
name="close"
class="dropdown-input-clear js-dropdown-input-clear gl-absolute gl-top-3 gl-right-5 gl-text-gray-700"
class="dropdown-input-clear js-dropdown-input-clear gl-absolute gl-top-3 gl-right-5 gl-text-gray-500"
/>
</div>
</template>
......@@ -70,9 +70,9 @@ export default {
<h5 class="gl-m-0">
{{ user.name }}
</h5>
<span class="gl-text-gray-700">@{{ user.username }}</span>
<span class="gl-text-gray-500">@{{ user.username }}</span>
</div>
<div class="gl-text-gray-700">
<div class="gl-text-gray-500">
<div v-if="user.bio" class="gl-display-flex gl-mb-2">
<icon name="profile" class="gl-text-gray-400 gl-flex-shrink-0" />
<span ref="bio" class="gl-ml-2" v-html="user.bioHtml"></span>
......@@ -82,7 +82,7 @@ export default {
<span ref="workInformation" class="gl-ml-2">{{ user.workInformation }}</span>
</div>
</div>
<div v-if="user.location" class="js-location gl-text-gray-700 gl-display-flex">
<div v-if="user.location" class="js-location gl-text-gray-500 gl-display-flex">
<icon name="location" class="gl-text-gray-400 flex-shrink-0" />
<span class="gl-ml-2">{{ user.location }}</span>
</div>
......
......@@ -31,7 +31,7 @@
border-radius: 50%;
&.resolved {
background-color: $gray-700;
background-color: $gray-500;
}
}
}
......
......@@ -232,7 +232,7 @@
height: $default-icon-size;
width: $default-icon-size;
border-radius: 50%;
fill: $gray-700;
fill: $gray-500;
}
}
......
......@@ -100,7 +100,7 @@
}
.group-variable-list {
color: $gray-700;
color: $gray-500;
.table-section:not(:first-child) {
@include media-breakpoint-down(sm) {
......
......@@ -6,7 +6,7 @@
.cdark { color: $common-gray-dark; }
.fwhite { fill: $white; }
.fgray { fill: $gray-700; }
.fgray { fill: $gray-500; }
.text-plain,
.text-plain:hover {
......
......@@ -296,7 +296,7 @@ body {
@include gitlab-theme(
$gray-200,
$gray-300,
$gray-700,
$gray-500,
$gray-800,
$gray-900,
$white
......@@ -305,12 +305,12 @@ body {
&.ui-light {
@include gitlab-theme(
$gray-700,
$gray-500,
$gray-800,
$gray-700,
$gray-700,
$gray-500,
$gray-500,
$gray-50,
$gray-700
$gray-500
);
.navbar-gitlab {
......@@ -341,7 +341,7 @@ body {
.container-fluid {
.navbar-toggler,
.navbar-toggler:hover {
color: $gray-700;
color: $gray-500;
border-left: 1px solid $gray-100;
}
}
......
......@@ -98,5 +98,5 @@
display: flex;
align-items: center;
justify-content: center;
color: $gray-700;
color: $gray-500;
}
......@@ -20,7 +20,7 @@
@extend .gl-responsive-table-row-layout;
margin-top: 10px;
border: 1px solid $border-color;
color: $gray-700;
color: $gray-500;
&.gl-responsive-table-row-clickable {
&:hover {
......
......@@ -42,7 +42,7 @@
}
&.spinner-dark {
@include spinner-color($gray-700);
@include spinner-color($gray-500);
}
&.spinner-light {
......
......@@ -24,7 +24,7 @@
.status-unavailable {
padding: 0 10px;
color: $gray-700;
color: $gray-500;
}
.status-green {
......
......@@ -16,7 +16,7 @@ table {
* Remove this code as soon as this happens
*/
&.gl-table {
@include gl-text-gray-700;
@include gl-text-gray-500;
}
&.table {
......@@ -60,7 +60,7 @@ table {
}
&.original-gl-th {
@include gl-text-gray-700;
@include gl-text-gray-500;
border-bottom: 1px solid $cycle-analytics-light-gray;
}
}
......
......@@ -169,7 +169,7 @@ $gray-300: #999 !default;
$gray-400: #868686 !default;
$gray-500: #666 !default;
$gray-600: #5e5e5e !default;
$gray-700: #707070 !default;
$gray-700: #525252 !default;
$gray-800: #4f4f4f !default;
$gray-900: #303030 !default;
$gray-950: #1f1f1f !default;
......@@ -350,7 +350,7 @@ $gl-font-size-large: 16px;
$gl-font-weight-normal: 400;
$gl-font-weight-bold: 600;
$gl-text-color: $gray-900;
$gl-text-color-secondary: $gray-700;
$gl-text-color-secondary: $gray-500;
$gl-text-color-tertiary: $gray-400;
$gl-text-color-quaternary: #d6d6d6;
$gl-text-color-inverted: $white;
......
......@@ -366,7 +366,7 @@ $ide-commit-header-height: 48px;
display: block;
margin-left: auto;
margin-right: auto;
color: var(--ide-text-color-secondary, $gray-700);
color: var(--ide-text-color-secondary, $gray-500);
}
.file-status-icon {
......@@ -689,7 +689,7 @@ $ide-commit-header-height: 48px;
border-bottom: 1px solid var(--ide-border-color-alt, $white-dark);
svg {
color: var(--ide-text-color-secondary, $gray-700);
color: var(--ide-text-color-secondary, $gray-500);
&:focus,
&:hover {
......@@ -721,7 +721,7 @@ $ide-commit-header-height: 48px;
&,
&:hover {
color: var(--ide-text-color-secondary, $gray-700);
color: var(--ide-text-color-secondary, $gray-500);
}
}
......@@ -1133,7 +1133,7 @@ $ide-commit-header-height: 48px;
.ide-file-icon-holder {
display: flex;
align-items: center;
color: var(--ide-text-color-secondary, $gray-700);
color: var(--ide-text-color-secondary, $gray-500);
}
.file-row:active {
......
......@@ -16,12 +16,12 @@
&:not(:first-child) {
&::before {
color: $gray-700;
color: $gray-500;
font-weight: normal !important;
}
div {
color: $gray-700;
color: $gray-500;
}
}
......
......@@ -540,7 +540,7 @@
}
.board-card-info-icon {
color: $gray-700;
color: $gray-500;
margin-right: $gl-padding-4;
vertical-align: text-top;
}
......
......@@ -5,7 +5,7 @@
// these styles need to be deleted once GlTable component looks in GitLab same as in @gitlab/ui
table {
@include gl-text-gray-700;
@include gl-text-gray-500;
tr {
&:focus {
......
......@@ -598,18 +598,18 @@
padding: 16px 0;
small {
color: $gray-700;
color: $gray-500;
}
}
.edited-text {
color: $gray-700;
color: $gray-500;
display: block;
margin: 16px 0 0;
font-size: 85%;
.author-link {
color: $gray-700;
color: $gray-500;
}
}
......@@ -960,7 +960,7 @@
.sidebar-collapsed-divider {
line-height: 5px;
font-size: 12px;
color: $gray-700;
color: $gray-500;
+ .sidebar-collapsed-icon {
padding-top: 0;
......
......@@ -1005,7 +1005,7 @@ $mr-widget-min-height: 69px;
.coverage {
font-size: 12px;
color: $gray-700;
color: $gray-500;
line-height: initial;
}
......
......@@ -152,7 +152,7 @@
}
.sidebar-item-value & {
fill: $gray-700;
fill: $gray-500;
}
}
......@@ -282,7 +282,7 @@ table {
display: table;
svg {
fill: $gray-700;
fill: $gray-500;
}
.btn-group {
......
......@@ -674,7 +674,7 @@ $note-form-margin-left: 72px;
.note-headline-meta {
.system-note-separator {
color: $gray-700;
color: $gray-500;
}
.note-timestamp {
......@@ -867,7 +867,7 @@ $note-form-margin-left: 72px;
line-height: $gl-line-height;
svg {
fill: $gray-700;
fill: $gray-500;
}
&.discussion-create-issue-btn {
......@@ -904,7 +904,7 @@ $note-form-margin-left: 72px;
border-right: 0;
.line-resolve-btn {
color: $gray-700;
color: $gray-500;
svg {
vertical-align: text-top;
......
......@@ -796,12 +796,12 @@
&.ci-status-icon-disabled,
&.ci-status-icon-not-found,
&.ci-status-icon-manual {
@include mini-pipeline-graph-color($white, $gray-700, $gray-800, $gray-900, $gray-950, $black);
@include mini-pipeline-graph-color($white, $gray-500, $gray-800, $gray-900, $gray-950, $black);
}
&.ci-status-icon-created,
&.ci-status-icon-skipped {
@include mini-pipeline-graph-color($white, $gray-100, $gray-200, $gray-300, $gray-400, $gray-700);
@include mini-pipeline-graph-color($white, $gray-100, $gray-200, $gray-300, $gray-400, $gray-500);
}
}
......
......@@ -77,7 +77,7 @@
}
&.neutral svg {
color: $gray-700;
color: $gray-500;
}
.ci-status-icon {
......
......@@ -2,7 +2,7 @@
%h3.my-4
= s_('AdminArea|Users statistics')
%table.table.gl-text-gray-700
%table.table.gl-text-gray-500
%tr
%td.p-3
= s_('AdminArea|Users without a Group and Project')
......
......@@ -14,7 +14,7 @@
.description
= markdown_field(group, :description)
.stats.gl-text-gray-700.gl-flex-shrink-0.gl-display-none.gl-display-sm-flex
.stats.gl-text-gray-500.gl-flex-shrink-0.gl-display-none.gl-display-sm-flex
%span.badge.badge-pill
= storage_counter(group.storage_size)
......
......@@ -42,7 +42,7 @@
.submit-container.mt-3
= f.submit _("Register"), class: "btn-register btn btn-block btn-success mb-0 p-2", data: { qa_selector: 'new_user_register_button' }
- if experiment_enabled?(:terms_opt_in)
%p.gl-text-gray-700.gl-mt-5.gl-mb-0
%p.gl-text-gray-500.gl-mt-5.gl-mb-0
= html_escape(_("By clicking Register, I agree that I have read and accepted the GitLab %{linkStart}Terms of Use and Privacy Policy%{linkEnd}")) % { linkStart: "<a href='#{terms_path}' target='_blank' rel='noreferrer noopener'>".html_safe, linkEnd: '</a>'.html_safe }
- if omniauth_enabled? && button_based_providers_enabled?
= render 'devise/shared/experimental_separate_sign_up_flow_omniauth_box'
......@@ -15,5 +15,5 @@
qa_selector: qa_selector }
- else
= text_area_tag attr, current_text, data: { qa_selector: qa_selector }, class: classes, placeholder: placeholder
%a.zen-control.zen-control-leave.js-zen-leave.gl-text-gray-700{ href: "#" }
%a.zen-control.zen-control-leave.js-zen-leave.gl-text-gray-500{ href: "#" }
= sprite_icon('compress')
......@@ -16,7 +16,7 @@
.description
= markdown_field(group, :description)
.stats.gl-text-gray-700.gl-flex-shrink-0
.stats.gl-text-gray-500.gl-flex-shrink-0
%span.gl-ml-5
= sprite_icon('bookmark', css_class: 'gl-vertical-align-text-bottom')
= number_with_delimiter(group.projects.non_archived.count)
......
......@@ -99,7 +99,7 @@ export default {
<template>
<div>
<h4 data-testid="chartTitle">{{ $options.strings.chartTitle }}</h4>
<div class="gl-text-gray-700" data-testid="chartDescription">
<div class="gl-text-gray-500" data-testid="chartDescription">
{{ $options.strings.chartDescription }}
</div>
<chart-skeleton-loader v-if="chartDataLoading" />
......
......@@ -136,7 +136,7 @@ export default {
<span class="dropdown-toggle-text"> {{ placeholderText }} </span>
<gl-icon
name="chevron-down"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-700"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-500"
:size="16"
/>
</button>
......@@ -157,7 +157,7 @@ dropdown-menu-user dropdown-menu-selectable dropdown-menu-author"
/>
<gl-icon
name="close"
class="dropdown-input-clear js-dropdown-input-clear gl-absolute gl-top-3 gl-right-5 gl-text-gray-700"
class="dropdown-input-clear js-dropdown-input-clear gl-absolute gl-top-3 gl-right-5 gl-text-gray-500"
/>
</div>
<div class="dropdown-content"></div>
......
......@@ -141,7 +141,7 @@ export default {
<span
v-gl-tooltip.hover
:title="issuesCountTooltipText"
class="gl-display-flex gl-align-items-center gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-text-gray-500"
tabindex="0"
:aria-label="issuesCountTooltipText"
data-testid="epic-lane-issue-count"
......
......@@ -114,7 +114,7 @@ export default {
<span
v-gl-tooltip.hover
:title="unassignedIssuesCountTooltipText"
class="gl-display-flex gl-align-items-center gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-text-gray-500"
tabindex="0"
:aria-label="unassignedIssuesCountTooltipText"
data-testid="issues-lane-issue-count"
......
......@@ -97,7 +97,7 @@ export default {
{{ __('Milestone') }}
<gl-icon
name="chevron-down"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-700"
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-500"
:size="16"
/>
</button>
......@@ -115,7 +115,7 @@ export default {
/>
<gl-icon
name="close"
class="dropdown-input-clear js-dropdown-input-clear gl-right-5 gl-absolute gl-top-3 gl-text-gray-700"
class="dropdown-input-clear js-dropdown-input-clear gl-right-5 gl-absolute gl-top-3 gl-text-gray-500"
/>
</div>
<div class="dropdown-content"></div>
......
......@@ -47,7 +47,7 @@ export default {
<template>
<div class="gl-display-flex gl-align-items-center gl-justify-content-end" data-testid="approvers">
<span class="gl-text-gray-700">
<span class="gl-text-gray-500">
<template v-if="hasApprovers">
{{ $options.strings.approvedBy }}
</template>
......
......@@ -106,7 +106,7 @@ export default {
uri: mergeRequest.target_branch_uri,
}"
/>
<span class="gl-text-gray-700">
<span class="gl-text-gray-500">
<time v-gl-tooltip.bottom="timeTooltip(mergeRequest.merged_at)">{{
timeAgoString(mergeRequest.merged_at)
}}</time>
......
......@@ -28,8 +28,8 @@ export default {
<a :href="mergeRequest.path" class="gl-display-block gl-text-gray-900 gl-font-weight-bold">
{{ mergeRequest.title }}
</a>
<span class="gl-text-gray-700">{{ mergeRequest.issuable_reference }}</span>
<span class="issuable-authored gl-text-gray-700 gl-display-inline-flex gl-align-items-center">
<span class="gl-text-gray-500">{{ mergeRequest.issuable_reference }}</span>
<span class="issuable-authored gl-text-gray-500 gl-display-inline-flex gl-align-items-center">
- {{ $options.strings.createdBy }}
<gl-avatar-link
:key="mergeRequest.author.id"
......
......@@ -11,7 +11,7 @@ export default {
<template>
<p
class="grid-column-heading gl-text-gray-700 gl-border-b-solid gl-border-b-2 gl-border-b-gray-100 gl-mb-0 gl-p-5"
class="grid-column-heading gl-text-gray-500 gl-border-b-solid gl-border-b-2 gl-border-b-gray-100 gl-mb-0 gl-p-5"
>
{{ heading }}
</p>
......
......@@ -71,7 +71,7 @@ export default {
type="text"
@update="checkName"
/>
<span class="gl-text-gray-700 m-n5 gl-z-index-2">{{ 255 - nodeData.name.length }}</span>
<span class="gl-text-gray-500 m-n5 gl-z-index-2">{{ 255 - nodeData.name.length }}</span>
</div>
</gl-form-group>
<section class="form-row">
......@@ -108,7 +108,7 @@ export default {
type="text"
@update="checkUrl"
/>
<span class="gl-text-gray-700 m-n5 gl-z-index-2">{{ 255 - nodeData.url.length }}</span>
<span class="gl-text-gray-500 m-n5 gl-z-index-2">{{ 255 - nodeData.url.length }}</span>
</div>
</gl-form-group>
<gl-form-group
......@@ -127,7 +127,7 @@ export default {
class="gl-pr-8!"
type="text"
/>
<span class="gl-text-gray-700 m-n5 gl-z-index-2">{{
<span class="gl-text-gray-500 m-n5 gl-z-index-2">{{
255 - nodeData.internalUrl.length
}}</span>
</div>
......
......@@ -38,7 +38,7 @@ export default {
<template>
<div class="mt-2 detail-section-item">
<div class="gl-text-gray-700 node-detail-title">{{ s__('GeoNodes|Replication status') }}</div>
<div class="gl-text-gray-500 node-detail-title">{{ s__('GeoNodes|Replication status') }}</div>
<div class="gl-display-flex gl-align-items-center">
<div
:class="replicationStatusCssClass"
......
......@@ -76,7 +76,7 @@ export default {
<div class="col-md-12">
<div class="gl-display-flex gl-flex-wrap gl-flex-direction-column gl-sm-flex-direction-row">
<div data-testid="nodeUrl" class="d-flex flex-column">
<span class="gl-text-gray-700">{{ s__('GeoNodes|Node URL') }}</span>
<span class="gl-text-gray-500">{{ s__('GeoNodes|Node URL') }}</span>
<gl-link
class="gl-display-flex gl-align-items-center gl-text-body gl-font-weight-bold gl-text-decoration-underline gl-mt-1"
:href="node.url"
......@@ -94,7 +94,7 @@ export default {
/>
</div>
<div data-testid="nodeVersion" class="d-flex flex-column mt-2">
<span class="gl-text-gray-700">{{ s__('GeoNodes|GitLab version') }}</span>
<span class="gl-text-gray-500">{{ s__('GeoNodes|GitLab version') }}</span>
<span :class="{ 'gl-text-red-500': versionMismatch }" class="gl-mt-1 gl-font-weight-bold">
{{ nodeVersion }}
</span>
......
......@@ -95,7 +95,7 @@ export default {
<gl-card :class="$options.cardClass" :body-class="$options.cardBodyClass">
<span>{{ column.title }}</span>
<span class="gl-font-size-h2 gl-font-weight-bold">{{ column.value }}</span>
<gl-icon v-if="column.icon" name="issues" :size="12" class="gl-text-gray-700" />
<gl-icon v-if="column.icon" name="issues" :size="12" class="gl-text-gray-500" />
</gl-card>
</div>
</div>
......
......@@ -140,7 +140,7 @@ export default {
v-if="hasHelpPath"
:href="helpPath"
target="_blank"
class="gl-display-flex gl-align-items-center gl-ml-2 gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-ml-2 gl-text-gray-500"
:aria-label="__('Read more about related issues')"
>
<gl-icon name="question" :size="12" role="text" />
......@@ -149,7 +149,7 @@ export default {
<div class="gl-display-inline-flex">
<div class="js-related-issues-header-issue-count gl-display-inline-flex gl-mx-5">
<span class="gl-display-inline-flex gl-align-items-center">
<gl-icon :name="issuableTypeIcon" class="gl-mr-2 gl-text-gray-700" />
<gl-icon :name="issuableTypeIcon" class="gl-mr-2 gl-text-gray-500" />
{{ badgeLabel }}
</span>
</div>
......
......@@ -50,11 +50,11 @@ export default {
{{ healthStatus.issuesOnTrack }}
</span>
</span>
<span class="gl-mr-2 mr-md-2 gl-text-gray-700 health-label-long gl-display-none!">
<span class="gl-mr-2 mr-md-2 gl-text-gray-500 health-label-long gl-display-none!">
{{ __('issues on track') }}
</span>
<span
class="gl-mr-2 mr-md-2 gl-text-gray-700 gl-str-truncated health-label-short gl-display-none!"
class="gl-mr-2 mr-md-2 gl-text-gray-500 gl-str-truncated health-label-short gl-display-none!"
>{{ __('on track') }}</span
>
......@@ -63,11 +63,11 @@ export default {
{{ healthStatus.issuesNeedingAttention }}
</span>
</span>
<span class="gl-mr-2 mr-md-2 gl-text-gray-700 health-label-long gl-display-none!">
<span class="gl-mr-2 mr-md-2 gl-text-gray-500 health-label-long gl-display-none!">
{{ __('issues need attention') }}
</span>
<span
class="gl-mr-2 mr-md-2 gl-text-gray-700 gl-str-truncated health-label-short gl-display-none!"
class="gl-mr-2 mr-md-2 gl-text-gray-500 gl-str-truncated health-label-short gl-display-none!"
>{{ __('need attention') }}</span
>
......@@ -76,10 +76,10 @@ export default {
{{ healthStatus.issuesAtRisk }}
</span>
</span>
<span class="gl-text-gray-700 health-label-long gl-display-none!">
<span class="gl-text-gray-500 health-label-long gl-display-none!">
{{ __('issues at risk') }}
</span>
<span class="gl-text-gray-700 gl-str-truncated health-label-short gl-display-none!">
<span class="gl-text-gray-500 gl-str-truncated health-label-short gl-display-none!">
{{ __('at risk') }}
</span>
</div>
......
......@@ -200,7 +200,7 @@ export default {
</div>
<div class="gl-p-2 gl-w-full">
<h5 class="gl-m-0">{{ author.name }}</h5>
<div class="gl-text-gray-700 gl-mb-3">@{{ author.username }}</div>
<div class="gl-text-gray-500 gl-mb-3">@{{ author.username }}</div>
</div>
</div>
</gl-popover>
......
......@@ -138,7 +138,7 @@ export default {
><gl-icon name="question"
/></gl-link>
</h4>
<p class="gl-text-gray-700 gl-m-0">
<p class="gl-text-gray-500 gl-m-0">
{{ __('Projects are graded based on the highest severity vulnerability present') }}
</p>
</header>
......@@ -162,13 +162,13 @@ export default {
>
{{ severityGroup.type }}
</span>
<span :class="{ 'gl-font-weight-bold': isExpanded, 'gl-text-gray-700': isDisabled }">
<span :class="{ 'gl-font-weight-bold': isExpanded, 'gl-text-gray-500': isDisabled }">
{{ n__('%d project', '%d projects', severityGroup.projects.length) }}
</span>
</h5>
</template>
<template #subTitle>
<p class="gl-m-0 ml-5 gl-pb-2 gl-text-gray-700">{{ severityGroup.warning }}</p>
<p class="gl-m-0 ml-5 gl-pb-2 gl-text-gray-500">{{ severityGroup.warning }}</p>
</template>
<div class="gl-ml-7 gl-pb-3">
<ul class="list-unstyled gl-py-2">
......
......@@ -147,7 +147,7 @@ export default {
:project-name="vulnerability.project.name"
/>
<br />
<small v-if="vulnerabilityNamespace" class="gl-text-gray-700 gl-word-break-all">
<small v-if="vulnerabilityNamespace" class="gl-text-gray-500 gl-word-break-all">
{{ vulnerabilityNamespace }}
</small>
</template>
......
......@@ -113,7 +113,7 @@ export default {
<span class="gl-mr-2 gl-font-weight-bold gl-font-sm">
{{ storageType.name }}
</span>
<span class="gl-text-gray-700 gl-font-sm">
<span class="gl-text-gray-500 gl-font-sm">
{{ formatSize(storageType.size) }}
</span>
</div>
......
......@@ -96,7 +96,7 @@ export default {
<div :class="$options.classes.headerClasses">
<div>
<h3>{{ name }}</h3>
<h4 class="gl-text-gray-700">{{ $options.translations.userIdLabel }}</h4>
<h4 class="gl-text-gray-500">{{ $options.translations.userIdLabel }}</h4>
</div>
<div class="gl-mt-6">
<gl-button v-if="editPath" :href="editPath" data-testid="edit-user-list" class="gl-mr-3">
......
......@@ -67,7 +67,7 @@ export default {
<h4 class="gl-min-width-fit-content gl-white-space-nowrap">
{{ $options.translations.formLabel }}
</h4>
<gl-sprintf :message="$options.translations.formSubtitle" class="gl-text-gray-700">
<gl-sprintf :message="$options.translations.formSubtitle" class="gl-text-gray-500">
<template #link="{ content }">
<gl-link :href="userListsDocsPath" data-testid="user-list-docs-link">
{{ content }}
......
......@@ -49,7 +49,7 @@
&-pending {
background-color: $gray-200;
border-color: $gray-700;
border-color: $gray-500;
&.link:hover {
background-color: $gray-300;
......@@ -59,7 +59,7 @@
&-unknown {
background-color: $white;
border-color: $gray-700;
border-color: $gray-500;
&.link:hover {
background-color: $white;
......
......@@ -149,11 +149,11 @@
&-message {
max-width: 600px;
color: $gray-700;
color: $gray-500;
}
&-close {
color: $gray-700;
color: $gray-500;
cursor: pointer;
}
......
......@@ -114,7 +114,7 @@
@include gl-white-space-nowrap;
.gl-button-text {
@include gl-text-gray-700;
@include gl-text-gray-500;
@include gl-display-flex;
@include gl-justify-content-space-between;
@include gl-w-full;
......
......@@ -33,7 +33,7 @@
flex-basis: 0;
.title {
color: $gray-700;
color: $gray-500;
line-height: $gl-line-height;
}
......
......@@ -417,7 +417,7 @@ html.group-epics-roadmap-html {
.timeline-bar-wrapper {
height: $timeline-cell-height;
color: $gray-700;
color: $gray-500;
}
.milestone-start-and-end {
......@@ -508,7 +508,7 @@ html.group-epics-roadmap-html {
.timeline-bar {
width: 100%;
background-color: $gray-700;
background-color: $gray-500;
height: 2px;
z-index: 1;
bottom: 4px;
......@@ -523,13 +523,13 @@ html.group-epics-roadmap-html {
&::before {
width: 2px;
background-color: $gray-700;
background-color: $gray-500;
}
&::after {
right: -3px;
width: 8px;
border: 2px solid $gray-700;
border: 2px solid $gray-500;
border-radius: 4px;
background-color: $white;
}
......@@ -557,6 +557,6 @@ html.group-epics-roadmap-html {
}
.milestone-item-date {
color: $gray-700;
color: $gray-500;
padding-top: $gl-spacing-scale-1;
}
......@@ -45,7 +45,7 @@ $subscriptions-full-width-lg: 541px;
.phase {
border-bottom: 5px solid $gray-100;
color: $gray-700;
color: $gray-500;
flex-basis: 100%;
font-size: $gl-font-size-12;
line-height: $gl-line-height;
......
......@@ -5,5 +5,5 @@
.text-content
%h4.gl-text-center
= s_("RemovedProjects|You haven’t removed any projects.")
%p.gl-text-gray-700
%p.gl-text-gray-500
= s_("RemovedProjects|Projects which are removed and are yet to be permanently removed are visible here.")
......@@ -8,7 +8,7 @@
.sub-header-block
.float-right
.dropdown.inline
%button.dropdown-toggle.btn.gl-text-gray-700{ type: 'button', 'data-toggle' => 'dropdown' }
%button.dropdown-toggle.btn.gl-text-gray-500{ type: 'button', 'data-toggle' => 'dropdown' }
= sprite_icon('calendar')
%b.caret
%ul.dropdown-menu.dropdown-menu-right
......
---
title: Replace -700 hex value, replace usages with -500
merge_request: 38793
author:
type: other
......@@ -6,7 +6,7 @@ exports[`MergeRequest component when there are approvers matches snapshot 1`] =
data-testid="approvers"
>
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
approved by:
......
......@@ -48,7 +48,7 @@ exports[`MergeRequestsGrid component when intialized matches the snapshot 1`] =
<!---->
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
<time>
merged 2 days ago
......@@ -79,7 +79,7 @@ exports[`MergeRequestsGrid component when intialized matches the snapshot 1`] =
<!---->
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
<time>
merged 2 days ago
......
......@@ -15,13 +15,13 @@ exports[`MergeRequest component when there is a merge request matches the snapsh
</a>
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
!1
</span>
<span
class="issuable-authored gl-text-gray-700 gl-display-inline-flex gl-align-items-center"
class="issuable-authored gl-text-gray-500 gl-display-inline-flex gl-align-items-center"
>
- created by:
......
......@@ -2,7 +2,7 @@
exports[`GridColumnHeading component behaviour matches the screenshot 1`] = `
<p
class="grid-column-heading gl-text-gray-700 gl-border-b-solid gl-border-b-2 gl-border-b-gray-100 gl-mb-0 gl-p-5"
class="grid-column-heading gl-text-gray-500 gl-border-b-solid gl-border-b-2 gl-border-b-gray-100 gl-mb-0 gl-p-5"
>
Test heading
......
......@@ -6,7 +6,7 @@ exports[`NodeDetailsSectionMain template node url section renders section correc
data-testid="nodeUrl"
>
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
Node URL
</span>
......@@ -36,7 +36,7 @@ exports[`NodeDetailsSectionMain template node version section renders section co
data-testid="nodeVersion"
>
<span
class="gl-text-gray-700"
class="gl-text-gray-500"
>
GitLab version
</span>
......
......@@ -140,7 +140,7 @@ describe('Design management dropzone component', () => {
it('applies correct classes when there are no designs or no design saving loader', () => {
createComponent({ props: { hasDesigns: false } });
expect(findDropzoneArea().classes()).not.toContain('gl-flex-direction-column');
expect(findIcon().classes()).toEqual(['gl-mr-3', 'gl-text-gray-700']);
expect(findIcon().classes()).toEqual(['gl-mr-3', 'gl-text-gray-500']);
expect(findIcon().props('size')).toBe(16);
});
......
......@@ -21,7 +21,7 @@ exports[`PackageTitle renders with tags 1`] = `
</h1>
<div
class="gl-display-flex gl-align-items-center gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-text-gray-500"
>
<gl-icon-stub
class="gl-mr-3"
......@@ -43,7 +43,7 @@ exports[`PackageTitle renders with tags 1`] = `
class="gl-display-flex gl-align-items-center gl-mr-5"
>
<gl-icon-stub
class="gl-text-gray-700 gl-mr-3"
class="gl-text-gray-500 gl-mr-3"
name="package"
size="16"
/>
......@@ -73,7 +73,7 @@ exports[`PackageTitle renders with tags 1`] = `
class="gl-display-flex gl-align-items-center gl-mr-5"
>
<gl-icon-stub
class="gl-text-gray-700 gl-mr-3"
class="gl-text-gray-500 gl-mr-3"
name="disk"
size="16"
/>
......@@ -110,7 +110,7 @@ exports[`PackageTitle renders without tags 1`] = `
</h1>
<div
class="gl-display-flex gl-align-items-center gl-text-gray-700"
class="gl-display-flex gl-align-items-center gl-text-gray-500"
>
<gl-icon-stub
class="gl-mr-3"
......@@ -132,7 +132,7 @@ exports[`PackageTitle renders without tags 1`] = `
class="gl-display-flex gl-align-items-center gl-mr-5"
>
<gl-icon-stub
class="gl-text-gray-700 gl-mr-3"
class="gl-text-gray-500 gl-mr-3"
name="package"
size="16"
/>
......@@ -155,7 +155,7 @@ exports[`PackageTitle renders without tags 1`] = `
class="gl-display-flex gl-align-items-center gl-mr-5"
>
<gl-icon-stub
class="gl-text-gray-700 gl-mr-3"
class="gl-text-gray-500 gl-mr-3"
name="disk"
size="16"
/>
......
......@@ -60,7 +60,7 @@ exports[`Snippet Description Edit component rendering matches the snapshot 1`] =
<a
aria-label="Leave zen mode"
class="zen-control zen-control-leave js-zen-leave gl-text-gray-700"
class="zen-control zen-control-leave js-zen-leave gl-text-gray-500"
href="#"
>
<icon-stub
......
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