Add latest changes from gitlab-org/gitlab@master
This commit is contained in:
parent
9a6e6bb248
commit
11c99a1a7a
|
|
@ -108,7 +108,6 @@ Style/StringConcatenation:
|
|||
- 'lib/gitlab/throttle.rb'
|
||||
- 'lib/gitlab/time_tracking_formatter.rb'
|
||||
- 'lib/gitlab/untrusted_regexp.rb'
|
||||
- 'lib/gitlab/usage/metrics/instrumentations/issues_created_from_alerts_metric.rb'
|
||||
- 'lib/gitlab/usage_data_queries.rb'
|
||||
- 'lib/google_api/cloud_platform/client.rb'
|
||||
- 'lib/kramdown/converter/commonmark.rb'
|
||||
|
|
|
|||
|
|
@ -177,11 +177,11 @@ export default {
|
|||
@setDateRange="onSetDateRange"
|
||||
@setPredefinedDateRange="setPredefinedDateRange"
|
||||
/>
|
||||
<div class="gl-display-flex gl-flex-direction-column gl-md-flex-direction-row">
|
||||
<div class="gl-flex gl-flex-col md:gl-flex-row">
|
||||
<path-navigation
|
||||
v-if="displayPathNavigation"
|
||||
data-testid="vsa-path-navigation"
|
||||
class="gl-w-full gl-mt-4"
|
||||
class="gl-mt-4 gl-w-full"
|
||||
:loading="isLoading || isLoadingStage"
|
||||
:stages="pathNavigationData"
|
||||
:selected-stage="selectedStage"
|
||||
|
|
|
|||
|
|
@ -145,7 +145,7 @@ export default {
|
|||
<template>
|
||||
<div>
|
||||
<filtered-search-bar
|
||||
class="gl-flex-grow-1"
|
||||
class="gl-grow"
|
||||
:namespace="namespacePath"
|
||||
recent-searches-storage-key="value-stream-analytics"
|
||||
:search-input-placeholder="__('Filter results')"
|
||||
|
|
|
|||
|
|
@ -65,16 +65,16 @@ export default {
|
|||
>
|
||||
<template #title>{{ pathItem.title }}</template>
|
||||
<div class="gl-px-4">
|
||||
<div class="gl-display-flex gl-justify-content-space-between">
|
||||
<div class="gl-pr-4 gl-pb-3">
|
||||
<div class="gl-flex gl-justify-between">
|
||||
<div class="gl-pb-3 gl-pr-4">
|
||||
{{ s__('ValueStreamEvent|Stage time (median)') }}
|
||||
</div>
|
||||
<div class="gl-pb-3 gl-font-bold">{{ pathItem.metric }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gl-px-4">
|
||||
<div class="gl-display-flex gl-justify-content-space-between">
|
||||
<div class="gl-pr-4 gl-pb-3">
|
||||
<div class="gl-flex gl-justify-between">
|
||||
<div class="gl-pb-3 gl-pr-4">
|
||||
{{ s__('ValueStreamEvent|Items in stage') }}
|
||||
</div>
|
||||
<div class="gl-pb-3 gl-font-bold">
|
||||
|
|
@ -87,29 +87,23 @@ export default {
|
|||
{{ s__('ValueStreamEvent|Only items that reached their stop event.') }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="gl-px-4 gl-pt-4 gl-border-t-1 gl-border-t-solid gl-border-gray-50">
|
||||
<div
|
||||
v-if="pathItem.startEventHtmlDescription"
|
||||
class="gl-display-flex gl-flex-direction-row"
|
||||
>
|
||||
<div class="gl-display-flex gl-flex-direction-column gl-pr-4 gl-pb-3 metric-label">
|
||||
<div class="gl-border-t-1 gl-border-gray-50 gl-px-4 gl-pt-4 gl-border-t-solid">
|
||||
<div v-if="pathItem.startEventHtmlDescription" class="gl-flex gl-flex-row">
|
||||
<div class="metric-label gl-flex gl-flex-col gl-pb-3 gl-pr-4">
|
||||
{{ s__('ValueStreamEvent|Start') }}
|
||||
</div>
|
||||
<div
|
||||
v-safe-html="pathItem.startEventHtmlDescription"
|
||||
class="gl-display-flex gl-flex-direction-column gl-pb-3 stage-event-description"
|
||||
class="stage-event-description gl-flex gl-flex-col gl-pb-3"
|
||||
></div>
|
||||
</div>
|
||||
<div
|
||||
v-if="pathItem.endEventHtmlDescription"
|
||||
class="gl-display-flex gl-flex-direction-row"
|
||||
>
|
||||
<div class="gl-display-flex gl-flex-direction-column gl-pr-4 metric-label">
|
||||
<div v-if="pathItem.endEventHtmlDescription" class="gl-flex gl-flex-row">
|
||||
<div class="metric-label gl-flex gl-flex-col gl-pr-4">
|
||||
{{ s__('ValueStreamEvent|Stop') }}
|
||||
</div>
|
||||
<div
|
||||
v-safe-html="pathItem.endEventHtmlDescription"
|
||||
class="gl-display-flex gl-flex-direction-column stage-event-description"
|
||||
class="stage-event-description gl-flex gl-flex-col"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -225,7 +225,7 @@ export default {
|
|||
<p class="gl-m-0">
|
||||
<gl-link
|
||||
data-testid="vsa-stage-event-link"
|
||||
class="gl-text-black-normal"
|
||||
class="gl-text-default"
|
||||
:href="item.url"
|
||||
>{{ itemId(item.id, '#') }}</gl-link
|
||||
>
|
||||
|
|
@ -233,7 +233,7 @@ export default {
|
|||
<gl-link
|
||||
v-if="item.branch"
|
||||
:href="item.branch.url"
|
||||
class="gl-text-black-normal ref-name"
|
||||
class="ref-name gl-text-default"
|
||||
>{{ item.branch.name }}</gl-link
|
||||
>
|
||||
<span class="icon-branch gl-text-gray-400">
|
||||
|
|
@ -243,37 +243,33 @@ export default {
|
|||
</p>
|
||||
<p class="gl-m-0">
|
||||
<span>
|
||||
<gl-link class="gl-text-black-normal" :href="item.url">{{ item.date }}</gl-link>
|
||||
<gl-link class="gl-text-default" :href="item.url">{{ item.date }}</gl-link>
|
||||
{{ s__('ByAuthor|by') }}
|
||||
<gl-link
|
||||
class="gl-text-black-normal issue-author-link"
|
||||
:href="item.author.webUrl"
|
||||
>{{ item.author.name }}</gl-link
|
||||
>
|
||||
<gl-link class="issue-author-link gl-text-default" :href="item.author.webUrl">{{
|
||||
item.author.name
|
||||
}}</gl-link>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div v-else>
|
||||
<h5 class="gl-font-bold gl-my-1" data-testid="vsa-stage-event-title">
|
||||
<gl-link class="gl-text-black-normal" :href="item.url">{{ itemTitle(item) }}</gl-link>
|
||||
<h5 class="gl-my-1 gl-font-bold" data-testid="vsa-stage-event-title">
|
||||
<gl-link class="gl-text-default" :href="item.url">{{ itemTitle(item) }}</gl-link>
|
||||
</h5>
|
||||
<p class="gl-m-0">
|
||||
<gl-link
|
||||
data-testid="vsa-stage-event-link"
|
||||
class="gl-text-black-normal"
|
||||
class="gl-text-default"
|
||||
:href="item.url"
|
||||
>{{ itemDisplayName(item) }}</gl-link
|
||||
>
|
||||
<span class="gl-font-lg">·</span>
|
||||
<span class="gl-text-lg">·</span>
|
||||
<span data-testid="vsa-stage-event-date">
|
||||
{{ s__('OpenedNDaysAgo|Created') }}
|
||||
<gl-link class="gl-text-black-normal" :href="item.url">{{
|
||||
item.createdAt
|
||||
}}</gl-link>
|
||||
<gl-link class="gl-text-default" :href="item.url">{{ item.createdAt }}</gl-link>
|
||||
</span>
|
||||
<span data-testid="vsa-stage-event-author">
|
||||
{{ s__('ByAuthor|by') }}
|
||||
<gl-link class="gl-text-black-normal" :href="item.author.webUrl">{{
|
||||
<gl-link class="gl-text-default" :href="item.author.webUrl">{{
|
||||
item.author.name
|
||||
}}</gl-link>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -130,17 +130,17 @@ export default {
|
|||
</script>
|
||||
<template>
|
||||
<div
|
||||
class="gl-mt-3 gl-py-5 gl-px-3 gl-bg-gray-10 gl-border-b-1 gl-border-b-solid gl-border-t-1 gl-border-t-solid gl-border-gray-100"
|
||||
class="gl-mt-3 gl-border-b-1 gl-border-t-1 gl-border-gray-100 gl-bg-gray-10 gl-px-3 gl-py-5 gl-border-b-solid gl-border-t-solid"
|
||||
>
|
||||
<filter-bar
|
||||
data-testid="vsa-filter-bar"
|
||||
class="filtered-search-box gl-display-flex gl-border-none"
|
||||
class="filtered-search-box gl-flex gl-border-none"
|
||||
:namespace-path="namespacePath"
|
||||
/>
|
||||
<hr v-if="shouldShowFilterDropdowns" class="gl-my-5" />
|
||||
<div
|
||||
v-if="shouldShowFilterDropdowns"
|
||||
class="gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-gap-5"
|
||||
class="gl-flex gl-flex-col gl-gap-5 lg:gl-flex-row"
|
||||
data-testid="vsa-filter-dropdowns-container"
|
||||
>
|
||||
<projects-dropdown-filter
|
||||
|
|
@ -155,7 +155,7 @@ export default {
|
|||
/>
|
||||
<div
|
||||
v-if="shouldShowDateRangeFilters"
|
||||
class="gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-gap-3"
|
||||
class="gl-flex gl-flex-col gl-gap-3 lg:gl-flex-row"
|
||||
data-testid="vsa-date-range-filter-container"
|
||||
>
|
||||
<date-ranges-dropdown
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { sprintf, s__ } from '~/locale';
|
|||
import DevopsScoreCallout from './devops_score_callout.vue';
|
||||
|
||||
const defaultHeaderAttrs = {
|
||||
thClass: 'gl-bg-white!',
|
||||
thClass: '!gl-bg-white',
|
||||
thAttr: { 'data-testid': 'header' },
|
||||
};
|
||||
|
||||
|
|
@ -81,7 +81,7 @@ export default {
|
|||
</template>
|
||||
</gl-empty-state>
|
||||
<div v-else data-testid="devops-score-app">
|
||||
<div class="gl-text-gray-400 gl-my-4" data-testid="devops-score-note-text">
|
||||
<div class="gl-my-4 gl-text-gray-400" data-testid="devops-score-note-text">
|
||||
{{ titleHelperText }}
|
||||
</div>
|
||||
<gl-single-stat
|
||||
|
|
|
|||
|
|
@ -130,7 +130,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="gl-display-flex gl-align-items-center gl-gap-3">
|
||||
<div class="gl-flex gl-items-center gl-gap-3">
|
||||
<gl-collapsible-listbox v-model="selectedValue" :items="items" @select="onSelect" />
|
||||
<div v-if="showDateRangeString || showTooltip" class="gl-text-gray-500">
|
||||
<span v-if="showDateRangeString" data-testid="predefined-date-range-string">{{
|
||||
|
|
|
|||
|
|
@ -73,11 +73,11 @@ export default {
|
|||
<template>
|
||||
<div
|
||||
v-if="show"
|
||||
class="gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row align-items-lg-center justify-content-lg-end"
|
||||
class="align-items-lg-center justify-content-lg-end gl-flex gl-flex-col lg:gl-flex-row"
|
||||
>
|
||||
<gl-daterange-picker
|
||||
v-model="dateRange"
|
||||
class="gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row"
|
||||
class="gl-flex gl-flex-col lg:gl-flex-row"
|
||||
:default-start-date="startDate"
|
||||
:default-end-date="endDate"
|
||||
:default-min-date="minDate"
|
||||
|
|
@ -88,9 +88,9 @@ export default {
|
|||
:from-label="__('From')"
|
||||
:to-label="__('To')"
|
||||
theme="animate-picker"
|
||||
start-picker-class="js-daterange-picker-from gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-lg-align-items-center gl-lg-mr-3 gl-mb-2 gl-lg-mb-0"
|
||||
end-picker-class="js-daterange-picker-to gl-display-flex gl-flex-direction-column gl-lg-flex-direction-row gl-lg-align-items-center gl-mb-2 gl-lg-mb-0"
|
||||
label-class="gl-mb-2 gl-lg-mb-0"
|
||||
start-picker-class="js-daterange-picker-from gl-flex gl-flex-col lg:gl-flex-row lg:gl-items-center lg:gl-mr-3 gl-mb-2 lg:gl-mb-0"
|
||||
end-picker-class="js-daterange-picker-to gl-flex gl-flex-col lg:gl-flex-row lg:gl-items-center gl-mb-2 lg:gl-mb-0"
|
||||
label-class="gl-mb-2 lg:gl-mb-0"
|
||||
>
|
||||
<template #default="{ daysSelected }">
|
||||
{{ numberOfDays(daysSelected) }}
|
||||
|
|
|
|||
|
|
@ -34,14 +34,12 @@ export default {
|
|||
<template>
|
||||
<gl-popover :target="target" placement="top">
|
||||
<template #title>
|
||||
<div
|
||||
class="gl-display-flex gl-justify-content-space-between gl-text-right gl-py-1 gl-align-items-center"
|
||||
>
|
||||
<div class="gl-flex gl-items-center gl-justify-between gl-py-1 gl-text-right">
|
||||
<span data-testid="metric-label">{{ metric.label }}</span>
|
||||
<gl-link
|
||||
v-if="metricLink"
|
||||
:href="metricLink.url"
|
||||
class="gl-font-sm gl-font-normal"
|
||||
class="gl-text-sm gl-font-normal"
|
||||
data-testid="metric-link"
|
||||
>{{ $options.metricPopoverLabel }}
|
||||
<gl-icon name="chart" />
|
||||
|
|
@ -52,7 +50,7 @@ export default {
|
|||
<gl-link
|
||||
v-if="docsLink"
|
||||
:href="docsLink.url"
|
||||
class="gl-font-sm"
|
||||
class="gl-text-sm"
|
||||
target="_blank"
|
||||
data-testid="metric-docs-link"
|
||||
>{{ docsLink.label }}
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ export default {
|
|||
:unit="metric.unit || ''"
|
||||
:should-animate="true"
|
||||
:animation-decimal-places="decimalPlaces"
|
||||
:class="{ 'gl-hover-cursor-pointer': hasLinks }"
|
||||
:class="{ 'hover:gl-cursor-pointer': hasLinks }"
|
||||
tabindex="0"
|
||||
use-delimiters
|
||||
@click="clickHandler(metric)"
|
||||
|
|
|
|||
|
|
@ -252,7 +252,7 @@ export default {
|
|||
>
|
||||
<template #toggle>
|
||||
<gl-button
|
||||
button-text-classes="gl-w-full gl-justify-content-space-between gl-display-flex gl-shadow-none gl-mb-0"
|
||||
button-text-classes="gl-w-full gl-justify-between gl-flex gl-shadow-none gl-mb-0"
|
||||
:class="['dropdown-projects', toggleClasses]"
|
||||
>
|
||||
<gl-avatar
|
||||
|
|
@ -263,14 +263,14 @@ export default {
|
|||
:size="16"
|
||||
:shape="$options.AVATAR_SHAPE_OPTION_RECT"
|
||||
:alt="selectedProjects[0].name"
|
||||
class="gl-inline-flex gl-align-middle gl-mr-2 gl-flex-shrink-0"
|
||||
class="gl-mr-2 gl-inline-flex gl-shrink-0 gl-align-middle"
|
||||
/>
|
||||
<gl-truncate :text="selectedProjectsLabel" class="gl-min-w-0 gl-flex-grow-1" />
|
||||
<gl-icon class="gl-ml-2 gl-flex-shrink-0" name="chevron-down" />
|
||||
<gl-truncate :text="selectedProjectsLabel" class="gl-min-w-0 gl-grow" />
|
||||
<gl-icon class="gl-ml-2 gl-shrink-0" name="chevron-down" />
|
||||
</gl-button>
|
||||
</template>
|
||||
<template #list-item="{ item }">
|
||||
<div class="gl-display-flex">
|
||||
<div class="gl-flex">
|
||||
<gl-avatar
|
||||
class="gl-mr-2 gl-align-middle"
|
||||
:alt="item.name"
|
||||
|
|
|
|||
|
|
@ -116,10 +116,10 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="gl-display-flex" data-testid="vsa-metrics" :class="isLoading ? 'gl-my-6' : 'gl-mt-6'">
|
||||
<div class="gl-flex" data-testid="vsa-metrics" :class="isLoading ? 'gl-my-6' : 'gl-mt-6'">
|
||||
<gl-skeleton-loader v-if="isLoading" />
|
||||
<template v-else>
|
||||
<div v-if="hasGroupedMetrics" class="gl-flex-direction-column">
|
||||
<div v-if="hasGroupedMetrics" class="gl-flex-col">
|
||||
<div
|
||||
v-for="(group, groupIndex) in groupedMetrics"
|
||||
:key="group.key"
|
||||
|
|
@ -127,7 +127,7 @@ export default {
|
|||
data-testid="vsa-metrics-group"
|
||||
>
|
||||
<h4 class="gl-my-0">{{ group.title }}</h4>
|
||||
<div class="gl-display-flex gl-flex-wrap">
|
||||
<div class="gl-flex gl-flex-wrap">
|
||||
<metric-tile
|
||||
v-for="metric in group.data"
|
||||
:key="metric.identifier"
|
||||
|
|
@ -142,7 +142,7 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="gl-display-flex gl-flex-wrap gl-mb-7">
|
||||
<div v-else class="gl-mb-7 gl-flex gl-flex-wrap">
|
||||
<metric-tile
|
||||
v-for="metric in metrics"
|
||||
:key="metric.identifier"
|
||||
|
|
|
|||
|
|
@ -19,11 +19,11 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="gl-display-flex gl-flex-direction-column" data-testid="vsd-link">
|
||||
<div class="gl-display-flex gl-mb-2">
|
||||
<div class="gl-flex gl-flex-col" data-testid="vsd-link">
|
||||
<div class="gl-mb-2 gl-flex">
|
||||
<span>{{ $options.i18n.title }}</span>
|
||||
</div>
|
||||
<div class="gl-display-flex gl-align-items-baseline">
|
||||
<div class="gl-flex gl-items-baseline">
|
||||
<gl-link :href="requestPath">{{ $options.i18n.linkText }}</gl-link
|
||||
> <gl-icon name="dashboard" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -63,15 +63,13 @@ export default {
|
|||
<template>
|
||||
<div>
|
||||
<page-heading :heading="$options.i18n.pageTitle" />
|
||||
<div
|
||||
class="gl-display-flex gl-flex-direction-column gl-md-flex-direction-row gl-my-6 gl-align-items-flex-start"
|
||||
>
|
||||
<div class="gl-my-6 gl-flex gl-flex-col gl-items-start md:gl-flex-row">
|
||||
<gl-skeleton-loader v-if="$apollo.queries.counts.loading" />
|
||||
<template v-else>
|
||||
<gl-single-stat
|
||||
v-for="count in counts"
|
||||
:key="count.key"
|
||||
class="gl-pr-9 gl-my-4 gl-md-mt-0 gl-md-mb-0"
|
||||
class="gl-my-4 gl-pr-9 md:gl-mb-0 md:gl-mt-0"
|
||||
:value="`${count.value}`"
|
||||
:title="count.label"
|
||||
:should-animate="true"
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@ export default {
|
|||
|
||||
<gl-icon
|
||||
v-show="connectSuccessful"
|
||||
class="js-error-tracking-connect-success gl-ml-2 text-success align-middle"
|
||||
class="js-error-tracking-connect-success gl-ml-2 gl-text-success align-middle"
|
||||
:aria-label="__('Projects Successfully Retrieved')"
|
||||
name="check"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ export const WEIGHT_DESC = 'WEIGHT_DESC';
|
|||
export const API_PARAM = 'apiParam';
|
||||
export const URL_PARAM = 'urlParam';
|
||||
export const NORMAL_FILTER = 'normalFilter';
|
||||
export const SPECIAL_FILTER = 'specialFilter';
|
||||
export const WILDCARD_FILTER = 'wildcardFilter';
|
||||
export const ALTERNATIVE_FILTER = 'alternativeFilter';
|
||||
|
||||
export const ISSUES_VIEW_TYPE_KEY = 'issuesViewType';
|
||||
|
|
@ -136,7 +136,7 @@ export const urlSortParams = {
|
|||
[BLOCKING_ISSUES_DESC]: 'blocking_issues_desc',
|
||||
};
|
||||
|
||||
export const specialFilterValues = [
|
||||
export const wildcardFilterValues = [
|
||||
FILTER_NONE,
|
||||
FILTER_ANY,
|
||||
FILTER_CURRENT,
|
||||
|
|
@ -219,13 +219,13 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_ASSIGNEE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'assigneeUsernames',
|
||||
[SPECIAL_FILTER]: 'assigneeWildcardId',
|
||||
[WILDCARD_FILTER]: 'assigneeWildcardId',
|
||||
[ALTERNATIVE_FILTER]: 'assigneeId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'assignee_username[]',
|
||||
[SPECIAL_FILTER]: 'assignee_id',
|
||||
[WILDCARD_FILTER]: 'assignee_id',
|
||||
[ALTERNATIVE_FILTER]: 'assignee_username',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
|
|
@ -250,13 +250,13 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_REVIEWER]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'reviewerUsername',
|
||||
[SPECIAL_FILTER]: 'reviewerWildcardId',
|
||||
[WILDCARD_FILTER]: 'reviewerWildcardId',
|
||||
[ALTERNATIVE_FILTER]: 'reviewerId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'reviewer_username',
|
||||
[SPECIAL_FILTER]: 'reviewer_id',
|
||||
[WILDCARD_FILTER]: 'reviewer_id',
|
||||
[ALTERNATIVE_FILTER]: 'reviewer_username',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
|
|
@ -267,29 +267,29 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_MILESTONE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'milestoneTitle',
|
||||
[SPECIAL_FILTER]: 'milestoneWildcardId',
|
||||
[WILDCARD_FILTER]: 'milestoneWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'milestone_title',
|
||||
[SPECIAL_FILTER]: 'milestone_title',
|
||||
[WILDCARD_FILTER]: 'milestone_title',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[milestone_title]',
|
||||
[SPECIAL_FILTER]: 'not[milestone_title]',
|
||||
[WILDCARD_FILTER]: 'not[milestone_title]',
|
||||
},
|
||||
},
|
||||
},
|
||||
[TOKEN_TYPE_LABEL]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'labelName',
|
||||
[SPECIAL_FILTER]: 'labelName',
|
||||
[WILDCARD_FILTER]: 'labelName',
|
||||
[ALTERNATIVE_FILTER]: 'labelNames',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'label_name[]',
|
||||
[SPECIAL_FILTER]: 'label_name[]',
|
||||
[WILDCARD_FILTER]: 'label_name[]',
|
||||
[ALTERNATIVE_FILTER]: 'label_name',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
|
|
@ -336,12 +336,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_RELEASE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'releaseTag',
|
||||
[SPECIAL_FILTER]: 'releaseTagWildcardId',
|
||||
[WILDCARD_FILTER]: 'releaseTagWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'release_tag',
|
||||
[SPECIAL_FILTER]: 'release_tag',
|
||||
[WILDCARD_FILTER]: 'release_tag',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[release_tag]',
|
||||
|
|
@ -351,12 +351,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_MY_REACTION]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'myReactionEmoji',
|
||||
[SPECIAL_FILTER]: 'myReactionEmoji',
|
||||
[WILDCARD_FILTER]: 'myReactionEmoji',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'my_reaction_emoji',
|
||||
[SPECIAL_FILTER]: 'my_reaction_emoji',
|
||||
[WILDCARD_FILTER]: 'my_reaction_emoji',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[my_reaction_emoji]',
|
||||
|
|
@ -386,30 +386,30 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_ITERATION]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'iterationId',
|
||||
[SPECIAL_FILTER]: 'iterationWildcardId',
|
||||
[WILDCARD_FILTER]: 'iterationWildcardId',
|
||||
[ALTERNATIVE_FILTER]: 'iterationCadenceId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'iteration_id',
|
||||
[SPECIAL_FILTER]: 'iteration_id',
|
||||
[WILDCARD_FILTER]: 'iteration_id',
|
||||
[ALTERNATIVE_FILTER]: 'iteration_cadence_id',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[iteration_id]',
|
||||
[SPECIAL_FILTER]: 'not[iteration_id]',
|
||||
[WILDCARD_FILTER]: 'not[iteration_id]',
|
||||
},
|
||||
},
|
||||
},
|
||||
[TOKEN_TYPE_EPIC]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'epicId',
|
||||
[SPECIAL_FILTER]: 'epicWildcardId',
|
||||
[WILDCARD_FILTER]: 'epicWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'epic_id',
|
||||
[SPECIAL_FILTER]: 'epic_id',
|
||||
[WILDCARD_FILTER]: 'epic_id',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[epic_id]',
|
||||
|
|
@ -419,12 +419,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_WEIGHT]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'weight',
|
||||
[SPECIAL_FILTER]: 'weightWildcardId',
|
||||
[WILDCARD_FILTER]: 'weightWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'weight',
|
||||
[SPECIAL_FILTER]: 'weight',
|
||||
[WILDCARD_FILTER]: 'weight',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[weight]',
|
||||
|
|
@ -434,12 +434,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_HEALTH]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'healthStatusFilter',
|
||||
[SPECIAL_FILTER]: 'healthStatusFilter',
|
||||
[WILDCARD_FILTER]: 'healthStatusFilter',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'health_status',
|
||||
[SPECIAL_FILTER]: 'health_status',
|
||||
[WILDCARD_FILTER]: 'health_status',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[health_status]',
|
||||
|
|
|
|||
|
|
@ -60,8 +60,8 @@ import {
|
|||
PRIORITY_ASC,
|
||||
PRIORITY_DESC,
|
||||
RELATIVE_POSITION_ASC,
|
||||
SPECIAL_FILTER,
|
||||
specialFilterValues,
|
||||
WILDCARD_FILTER,
|
||||
wildcardFilterValues,
|
||||
TITLE_ASC,
|
||||
TITLE_DESC,
|
||||
UPDATED_ASC,
|
||||
|
|
@ -314,33 +314,29 @@ const getFilterType = ({ type, value: { data, operator } }) => {
|
|||
) {
|
||||
return ALTERNATIVE_FILTER;
|
||||
}
|
||||
if (specialFilterValues.includes(data)) {
|
||||
return SPECIAL_FILTER;
|
||||
if (wildcardFilterValues.includes(data)) {
|
||||
return WILDCARD_FILTER;
|
||||
}
|
||||
|
||||
return NORMAL_FILTER;
|
||||
};
|
||||
|
||||
const wildcardTokens = [
|
||||
TOKEN_TYPE_ASSIGNEE,
|
||||
TOKEN_TYPE_EPIC,
|
||||
TOKEN_TYPE_HEALTH,
|
||||
TOKEN_TYPE_ITERATION,
|
||||
TOKEN_TYPE_MILESTONE,
|
||||
TOKEN_TYPE_RELEASE,
|
||||
TOKEN_TYPE_EPIC,
|
||||
TOKEN_TYPE_ASSIGNEE,
|
||||
TOKEN_TYPE_REVIEWER,
|
||||
TOKEN_TYPE_WEIGHT,
|
||||
];
|
||||
|
||||
const isWildcardValue = (tokenType, value) =>
|
||||
wildcardTokens.includes(tokenType) && specialFilterValues.includes(value);
|
||||
|
||||
const isHealthStatusSpecialFilter = (tokenType, value) =>
|
||||
tokenType === TOKEN_TYPE_HEALTH && specialFilterValues.includes(value);
|
||||
wildcardTokens.includes(tokenType) && wildcardFilterValues.includes(value);
|
||||
|
||||
const requiresUpperCaseValue = (tokenType, value) =>
|
||||
tokenType === TOKEN_TYPE_TYPE ||
|
||||
isWildcardValue(tokenType, value) ||
|
||||
isHealthStatusSpecialFilter(tokenType, value);
|
||||
tokenType === TOKEN_TYPE_TYPE || isWildcardValue(tokenType, value);
|
||||
|
||||
const formatData = (token) => {
|
||||
if (requiresUpperCaseValue(token.type, token.value.data)) {
|
||||
|
|
@ -383,7 +379,7 @@ export const convertToApiParams = (filterTokens) => {
|
|||
const cadenceId = fullIterationCadenceId(cadence);
|
||||
const iterationWildCardId = iteration.toUpperCase();
|
||||
obj.set(apiField, obj.has(apiField) ? [obj.get(apiField), cadenceId].flat() : cadenceId);
|
||||
const secondApiField = filtersMap[token.type][API_PARAM][SPECIAL_FILTER];
|
||||
const secondApiField = filtersMap[token.type][API_PARAM][WILDCARD_FILTER];
|
||||
obj.set(
|
||||
secondApiField,
|
||||
obj.has(secondApiField)
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ import {
|
|||
ALTERNATIVE_FILTER,
|
||||
API_PARAM,
|
||||
NORMAL_FILTER,
|
||||
SPECIAL_FILTER,
|
||||
WILDCARD_FILTER,
|
||||
URL_PARAM,
|
||||
} from '~/issues/list/constants';
|
||||
|
||||
|
|
@ -58,12 +58,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_ASSIGNEE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'assigneeUsernames',
|
||||
[SPECIAL_FILTER]: 'assigneeId',
|
||||
[WILDCARD_FILTER]: 'assigneeId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'assignee_username[]',
|
||||
[SPECIAL_FILTER]: 'assignee_id',
|
||||
[WILDCARD_FILTER]: 'assignee_id',
|
||||
[ALTERNATIVE_FILTER]: 'assignee_username',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
|
|
@ -77,29 +77,29 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_MILESTONE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'milestoneTitle',
|
||||
[SPECIAL_FILTER]: 'milestoneWildcardId',
|
||||
[WILDCARD_FILTER]: 'milestoneWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'milestone_title',
|
||||
[SPECIAL_FILTER]: 'milestone_title',
|
||||
[WILDCARD_FILTER]: 'milestone_title',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[milestone_title]',
|
||||
[SPECIAL_FILTER]: 'not[milestone_title]',
|
||||
[WILDCARD_FILTER]: 'not[milestone_title]',
|
||||
},
|
||||
},
|
||||
},
|
||||
[TOKEN_TYPE_LABEL]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'labelName',
|
||||
[SPECIAL_FILTER]: 'labelName',
|
||||
[WILDCARD_FILTER]: 'labelName',
|
||||
[ALTERNATIVE_FILTER]: 'labelNames',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'label_name[]',
|
||||
[SPECIAL_FILTER]: 'label_name[]',
|
||||
[WILDCARD_FILTER]: 'label_name[]',
|
||||
[ALTERNATIVE_FILTER]: 'label_name',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
|
|
@ -126,12 +126,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_RELEASE]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'releaseTag',
|
||||
[SPECIAL_FILTER]: 'releaseTagWildcardId',
|
||||
[WILDCARD_FILTER]: 'releaseTagWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'release_tag',
|
||||
[SPECIAL_FILTER]: 'release_tag',
|
||||
[WILDCARD_FILTER]: 'release_tag',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[release_tag]',
|
||||
|
|
@ -141,12 +141,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_MY_REACTION]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'myReactionEmoji',
|
||||
[SPECIAL_FILTER]: 'myReactionEmoji',
|
||||
[WILDCARD_FILTER]: 'myReactionEmoji',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'my_reaction_emoji',
|
||||
[SPECIAL_FILTER]: 'my_reaction_emoji',
|
||||
[WILDCARD_FILTER]: 'my_reaction_emoji',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[my_reaction_emoji]',
|
||||
|
|
@ -166,28 +166,28 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_ITERATION]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'iterationId',
|
||||
[SPECIAL_FILTER]: 'iterationWildcardId',
|
||||
[WILDCARD_FILTER]: 'iterationWildcardId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'iteration_id',
|
||||
[SPECIAL_FILTER]: 'iteration_id',
|
||||
[WILDCARD_FILTER]: 'iteration_id',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[iteration_id]',
|
||||
[SPECIAL_FILTER]: 'not[iteration_id]',
|
||||
[WILDCARD_FILTER]: 'not[iteration_id]',
|
||||
},
|
||||
},
|
||||
},
|
||||
[TOKEN_TYPE_EPIC]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'epicId',
|
||||
[SPECIAL_FILTER]: 'epicId',
|
||||
[WILDCARD_FILTER]: 'epicId',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'epic_id',
|
||||
[SPECIAL_FILTER]: 'epic_id',
|
||||
[WILDCARD_FILTER]: 'epic_id',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[epic_id]',
|
||||
|
|
@ -197,12 +197,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_WEIGHT]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'weight',
|
||||
[SPECIAL_FILTER]: 'weight',
|
||||
[WILDCARD_FILTER]: 'weight',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'weight',
|
||||
[SPECIAL_FILTER]: 'weight',
|
||||
[WILDCARD_FILTER]: 'weight',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[weight]',
|
||||
|
|
@ -212,12 +212,12 @@ export const filtersMap = {
|
|||
[TOKEN_TYPE_HEALTH]: {
|
||||
[API_PARAM]: {
|
||||
[NORMAL_FILTER]: 'healthStatusFilter',
|
||||
[SPECIAL_FILTER]: 'healthStatusFilter',
|
||||
[WILDCARD_FILTER]: 'healthStatusFilter',
|
||||
},
|
||||
[URL_PARAM]: {
|
||||
[OPERATOR_IS]: {
|
||||
[NORMAL_FILTER]: 'health_status',
|
||||
[SPECIAL_FILTER]: 'health_status',
|
||||
[WILDCARD_FILTER]: 'health_status',
|
||||
},
|
||||
[OPERATOR_NOT]: {
|
||||
[NORMAL_FILTER]: 'not[health_status]',
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@ import { isAssigneeIdParam, isNotEmptySearchToken } from '~/issues/list/utils';
|
|||
import {
|
||||
ALTERNATIVE_FILTER,
|
||||
NORMAL_FILTER,
|
||||
SPECIAL_FILTER,
|
||||
URL_PARAM,
|
||||
specialFilterValues,
|
||||
WILDCARD_FILTER,
|
||||
wildcardFilterValues,
|
||||
} from '~/issues/list/constants';
|
||||
import { filtersMap } from './constants';
|
||||
|
||||
|
|
@ -18,8 +18,8 @@ const getFilterType = ({ type, value: { data, operator } }) => {
|
|||
if (isUnionedLabel || isAssigneeIdParam(type, data)) {
|
||||
return ALTERNATIVE_FILTER;
|
||||
}
|
||||
if (specialFilterValues.includes(data)) {
|
||||
return SPECIAL_FILTER;
|
||||
if (wildcardFilterValues.includes(data)) {
|
||||
return WILDCARD_FILTER;
|
||||
}
|
||||
return NORMAL_FILTER;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -157,7 +157,7 @@ export default {
|
|||
coverageDeltaClass() {
|
||||
const delta = this.pipelineCoverageDelta;
|
||||
if (delta && parseFloat(delta) > 0) {
|
||||
return 'text-success';
|
||||
return 'gl-text-success';
|
||||
}
|
||||
if (delta && parseFloat(delta) < 0) {
|
||||
return 'gl-text-danger';
|
||||
|
|
|
|||
|
|
@ -253,7 +253,7 @@ export default {
|
|||
:class="{ 'pr-sm-8': sidebarStatus }"
|
||||
>
|
||||
<div
|
||||
class="gl-display-flex gl-justify-content-space-between gl-align-items-center gl-px-1 py-3 py-md-4 gl-border-b-1 gl-border-b-gray-100 gl-border-b-solid gl-flex-direction-column gl-sm-flex-direction-row"
|
||||
class="py-3 py-md-4 gl-flex gl-flex-col gl-items-center gl-justify-between gl-border-b-1 gl-border-b-gray-100 gl-px-1 gl-border-b-solid sm:gl-flex-row"
|
||||
>
|
||||
<div data-testid="alert-header">
|
||||
<gl-badge class="gl-mr-3">
|
||||
|
|
@ -270,7 +270,7 @@ export default {
|
|||
</div>
|
||||
<gl-button
|
||||
v-if="alert.issue"
|
||||
class="gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline alert-details-incident-button"
|
||||
class="mt-sm-0 align-self-center align-self-sm-baseline alert-details-incident-button gl-mt-3"
|
||||
data-testid="viewIncidentBtn"
|
||||
:href="incidentPath(alert.issue.iid)"
|
||||
category="primary"
|
||||
|
|
@ -280,7 +280,7 @@ export default {
|
|||
</gl-button>
|
||||
<gl-button
|
||||
v-else
|
||||
class="gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline alert-details-incident-button"
|
||||
class="mt-sm-0 align-self-center align-self-sm-baseline alert-details-incident-button gl-mt-3"
|
||||
data-testid="createIncidentBtn"
|
||||
:loading="incidentCreationInProgress"
|
||||
category="primary"
|
||||
|
|
@ -293,16 +293,13 @@ export default {
|
|||
:aria-label="__('Toggle sidebar')"
|
||||
category="primary"
|
||||
variant="default"
|
||||
class="d-sm-none gl-absolute toggle-sidebar-mobile-button"
|
||||
class="d-sm-none toggle-sidebar-mobile-button gl-absolute"
|
||||
type="button"
|
||||
icon="chevron-double-lg-left"
|
||||
@click="toggleSidebar"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
v-if="alert"
|
||||
class="gl-display-flex gl-justify-content-space-between gl-align-items-center"
|
||||
>
|
||||
<div v-if="alert" class="gl-flex gl-items-center gl-justify-between">
|
||||
<h2 data-testid="title">{{ alert.title }}</h2>
|
||||
</div>
|
||||
<gl-tabs v-if="alert" v-model="currentTabIndex" data-testid="alertDetailsTabs">
|
||||
|
|
@ -324,7 +321,7 @@ export default {
|
|||
>
|
||||
<gl-link
|
||||
v-if="environmentPath"
|
||||
class="gl-display-inline-block"
|
||||
class="gl-inline-block"
|
||||
data-testid="environmentPath"
|
||||
:href="environmentPath"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
dropdownClass() {
|
||||
return this.isSidebar && !this.isDropdownShowing ? 'gl-display-none' : '';
|
||||
return this.isSidebar && !this.isDropdownShowing ? 'gl-hidden' : '';
|
||||
},
|
||||
items() {
|
||||
return Object.entries(this.statuses).map(([value, text]) => ({ value, text }));
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="gl-my-5 gl-display-flex">
|
||||
<div class="gl-font-bold gl-w-13 gl-text-right gl-pr-3">{{ label }}</div>
|
||||
<div class="gl-my-5 gl-flex">
|
||||
<div class="gl-w-13 gl-pr-3 gl-text-right gl-font-bold">{{ label }}</div>
|
||||
<div class="gl-pl-2">
|
||||
<slot></slot>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ export default {
|
|||
.sort((a, b) => (a.active === b.active ? 0 : a.active ? -1 : 1)); // eslint-disable-line no-nested-ternary
|
||||
},
|
||||
dropdownClass() {
|
||||
return this.isDropdownShowing ? 'dropdown-menu-selectable show' : 'gl-display-none';
|
||||
return this.isDropdownShowing ? 'dropdown-menu-selectable show' : 'gl-hidden';
|
||||
},
|
||||
dropDownTitle() {
|
||||
return this.userName ?? __('Select assignee');
|
||||
|
|
@ -193,8 +193,8 @@ export default {
|
|||
|
||||
<template>
|
||||
<div
|
||||
class="alert-assignees gl-py-5 gl-w-7/10"
|
||||
:class="{ 'gl-border-b-1 gl-border-b-solid gl-border-b-gray-100': !sidebarCollapsed }"
|
||||
class="alert-assignees gl-w-7/10 gl-py-5"
|
||||
:class="{ 'gl-border-b-1 gl-border-b-gray-100 gl-border-b-solid': !sidebarCollapsed }"
|
||||
>
|
||||
<template v-if="sidebarCollapsed">
|
||||
<div
|
||||
|
|
@ -216,16 +216,14 @@ export default {
|
|||
</template>
|
||||
|
||||
<div v-else>
|
||||
<p
|
||||
class="gl-text-gray-900 gl-mb-2 gl-leading-20 gl-display-flex gl-justify-content-space-between"
|
||||
>
|
||||
<p class="gl-mb-2 gl-flex gl-justify-between gl-leading-20 gl-text-default">
|
||||
{{ __('Assignee') }}
|
||||
<gl-button
|
||||
v-if="isEditable"
|
||||
ref="editButton"
|
||||
category="tertiary"
|
||||
size="small"
|
||||
class="gl-text-black-normal!"
|
||||
class="!gl-text-default"
|
||||
@click="toggleFormDropdown"
|
||||
@keydown.esc="hideDropdown"
|
||||
>
|
||||
|
|
@ -282,18 +280,18 @@ export default {
|
|||
class="hide-collapsed value gl-m-0"
|
||||
:class="{ 'no-value': !userName }"
|
||||
>
|
||||
<div v-if="userName" class="gl-inline-flex gl-mt-2" data-testid="assigned-users">
|
||||
<div v-if="userName" class="gl-mt-2 gl-inline-flex" data-testid="assigned-users">
|
||||
<span class="gl-relative gl-mr-4">
|
||||
<img :alt="userName" :src="userImg" :width="32" class="avatar avatar-inline gl-m-0 s32" />
|
||||
<img :alt="userName" :src="userImg" :width="32" class="avatar avatar-inline s32 gl-m-0" />
|
||||
</span>
|
||||
<span class="gl-display-flex gl-flex-direction-column gl-overflow-hidden">
|
||||
<span class="gl-flex gl-flex-col gl-overflow-hidden">
|
||||
<strong class="dropdown-menu-user-full-name">
|
||||
{{ userFullName }}
|
||||
</strong>
|
||||
<span class="dropdown-menu-user-username">@{{ userName }}</span>
|
||||
</span>
|
||||
</div>
|
||||
<span v-else class="gl-display-flex gl-align-items-center gl-leading-normal">
|
||||
<span v-else class="gl-flex gl-items-center gl-leading-normal">
|
||||
{{ __('None') }} -
|
||||
<gl-button
|
||||
class="gl-ml-2 !gl-text-inherit"
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="block gl-display-flex gl-justify-content-space-between gl-border-b-gray-100!">
|
||||
<div class="block gl-flex gl-justify-between !gl-border-b-gray-100">
|
||||
<sidebar-todo
|
||||
v-if="!sidebarCollapsed"
|
||||
:project-path="projectPath"
|
||||
|
|
|
|||
|
|
@ -49,7 +49,7 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
dropdownClass() {
|
||||
return this.isDropdownShowing ? 'show' : 'gl-display-none';
|
||||
return this.isDropdownShowing ? 'show' : 'gl-hidden';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -77,7 +77,7 @@ export default {
|
|||
<template>
|
||||
<div
|
||||
class="alert-status gl-py-5"
|
||||
:class="{ 'gl-border-b-1 gl-border-b-solid gl-border-b-gray-100': !sidebarCollapsed }"
|
||||
:class="{ 'gl-border-b-1 gl-border-b-gray-100 gl-border-b-solid': !sidebarCollapsed }"
|
||||
>
|
||||
<template v-if="sidebarCollapsed">
|
||||
<div ref="status" class="gl-ml-6" data-testid="status-icon" @click="$emit('toggle-sidebar')">
|
||||
|
|
@ -94,13 +94,11 @@ export default {
|
|||
</template>
|
||||
|
||||
<div v-else>
|
||||
<p
|
||||
class="gl-text-gray-900 gl-mb-2 gl-leading-20 gl-display-flex gl-justify-content-space-between"
|
||||
>
|
||||
<p class="gl-mb-2 gl-flex gl-justify-between gl-leading-20 gl-text-default">
|
||||
{{ s__('AlertManagement|Status') }}
|
||||
<gl-button
|
||||
v-if="isEditable"
|
||||
class="gl-text-black-normal!"
|
||||
class="!gl-text-default"
|
||||
category="tertiary"
|
||||
size="small"
|
||||
@click="toggleFormDropdown"
|
||||
|
|
|
|||
|
|
@ -129,7 +129,7 @@ export default {
|
|||
<div
|
||||
:class="{
|
||||
block: sidebarCollapsed,
|
||||
'gl-inline-flex gl-flex-basis-full': !sidebarCollapsed,
|
||||
'gl-inline-flex gl-basis-full': !sidebarCollapsed,
|
||||
}"
|
||||
>
|
||||
<todo
|
||||
|
|
|
|||
|
|
@ -35,12 +35,12 @@ export default {
|
|||
<template>
|
||||
<li
|
||||
:id="noteAnchorId"
|
||||
class="timeline-entry note system-note note-wrapper gl-p-0!"
|
||||
class="timeline-entry note system-note note-wrapper !gl-p-0"
|
||||
data-testid="alert-system-note-container"
|
||||
>
|
||||
<div class="gl-inline-flex gl-align-items-center gl-relative">
|
||||
<div class="gl-relative gl-inline-flex gl-items-center">
|
||||
<div
|
||||
class="gl-display-inline gl-bg-white gl-text-gray-200 gl-border-gray-100 gl-border-1 gl-border-solid gl-rounded-full gl-box-sizing-content-box gl-p-3 -gl-mt-2 gl-mr-6"
|
||||
class="gl-box-sizing-content-box -gl-mt-2 gl-mr-6 gl-inline gl-rounded-full gl-border-1 gl-border-solid gl-border-gray-100 gl-bg-white gl-p-3 gl-text-gray-200"
|
||||
>
|
||||
<gl-icon :name="note.systemNoteIconName" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -10,8 +10,8 @@ import { isValidURL } from '~/lib/utils/url_utility';
|
|||
import { s__ } from '~/locale';
|
||||
import { PAGE_CONFIG } from '~/vue_shared/alert_details/constants';
|
||||
|
||||
const thClass = 'gl-bg-transparent! gl-border-1! gl-border-b-solid! gl-border-gray-200!';
|
||||
const tdClass = 'gl-border-gray-100! gl-p-5!';
|
||||
const thClass = '!gl-bg-transparent !gl-border-1 !gl-border-b-solid !gl-border-gray-200';
|
||||
const tdClass = '!gl-border-gray-100 !gl-p-5';
|
||||
|
||||
const allowedFields = [
|
||||
'iid',
|
||||
|
|
|
|||
|
|
@ -179,7 +179,7 @@ export default {
|
|||
v-for="awardList in groupedAwards"
|
||||
:key="awardList.name"
|
||||
v-gl-tooltip.viewport
|
||||
class="gl-mr-3 gl-my-2"
|
||||
class="gl-my-2 gl-mr-3"
|
||||
:class="awardList.classes"
|
||||
:title="awardList.title"
|
||||
:data-emoji-name="awardList.name"
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ export default {
|
|||
};
|
||||
|
||||
const template = `
|
||||
<div style="height:600px;" class="gl-display-flex gl-justify-content-center gl-align-items-center">
|
||||
<div style="height:600px;" class="gl-flex gl-justify-center gl-items-center">
|
||||
<beta-badge />
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ export default {
|
|||
};
|
||||
|
||||
const template = `
|
||||
<div style="height:600px;" class="gl-display-flex gl-justify-content-center gl-align-items-center">
|
||||
<div style="height:600px;" class="gl-flex gl-justify-center gl-items-center">
|
||||
<experiment-badge />
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
|
|
@ -145,26 +145,19 @@ export default {
|
|||
</script>
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
class="file-content code js-syntax-highlight gl-display-flex"
|
||||
:class="$options.userColorScheme"
|
||||
>
|
||||
<div class="file-content code js-syntax-highlight gl-flex" :class="$options.userColorScheme">
|
||||
<blame v-if="showBlame && blameInfoForRange.length" :blame-info="blameInfoForRange" />
|
||||
<div class="line-numbers gl-px-0!">
|
||||
<div
|
||||
v-for="line in lineNumbers"
|
||||
:key="line"
|
||||
class="gl-display-flex diff-line-num line-links"
|
||||
>
|
||||
<div class="line-numbers !gl-px-0">
|
||||
<div v-for="line in lineNumbers" :key="line" class="diff-line-num line-links gl-flex">
|
||||
<a
|
||||
v-if="showBlameLink"
|
||||
class="gl-select-none !gl-shadow-none file-line-blame -gl-mx-2"
|
||||
class="file-line-blame -gl-mx-2 gl-select-none !gl-shadow-none"
|
||||
:href="`${blamePath}#L${line}`"
|
||||
></a>
|
||||
<a
|
||||
:id="`L${line}`"
|
||||
:key="line"
|
||||
class="gl-select-none !gl-shadow-none file-line-num"
|
||||
class="file-line-num gl-select-none !gl-shadow-none"
|
||||
:href="`#L${line}`"
|
||||
:data-line-number="line"
|
||||
@click="scrollToLine(`#LC${line}`)"
|
||||
|
|
@ -173,11 +166,9 @@ export default {
|
|||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="blob-content gl-display-flex gl-flex-direction-column gl-overflow-y-auto gl-w-full"
|
||||
>
|
||||
<div class="blob-content gl-flex gl-w-full gl-flex-col gl-overflow-y-auto">
|
||||
<pre
|
||||
class="code highlight gl-p-0!"
|
||||
class="code highlight !gl-p-0"
|
||||
><code v-safe-html="content" :data-blob-hash="blobHash" ></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@ export default {
|
|||
</script>
|
||||
<template>
|
||||
<div>
|
||||
<div class="gl-display-flex gl-flex-wrap gl-gap-5">
|
||||
<div class="gl-flex gl-flex-wrap gl-gap-5">
|
||||
<segmented-control-button-group
|
||||
:options="chartRanges"
|
||||
:value="selectedChart"
|
||||
|
|
|
|||
|
|
@ -149,7 +149,7 @@ export default {
|
|||
<gl-disclosure-dropdown-group v-if="sshUrl">
|
||||
<code-dropdown-item
|
||||
:label="$options.i18n.cloneWithSsh"
|
||||
label-class="gl-font-sm! gl-pt-2!"
|
||||
label-class="!gl-text-sm !gl-pt-2"
|
||||
:link="sshUrl"
|
||||
name="ssh_project_clone"
|
||||
input-id="copy-ssh-url-input"
|
||||
|
|
@ -159,7 +159,7 @@ export default {
|
|||
<gl-disclosure-dropdown-group v-if="httpUrl">
|
||||
<code-dropdown-item
|
||||
:label="httpLabel"
|
||||
label-class="gl-font-sm! gl-pt-2!"
|
||||
label-class="!gl-text-sm !gl-pt-2"
|
||||
:link="httpUrl"
|
||||
name="http_project_clone"
|
||||
input-id="copy-http-url-input"
|
||||
|
|
@ -169,7 +169,7 @@ export default {
|
|||
<gl-disclosure-dropdown-group v-if="kerberosUrl">
|
||||
<code-dropdown-item
|
||||
:label="$options.i18n.cloneWithKerberos"
|
||||
label-class="gl-font-sm! gl-pt-2!"
|
||||
label-class="!gl-text-sm !gl-pt-2"
|
||||
:link="kerberosUrl"
|
||||
name="kerberos_project_clone"
|
||||
input-id="copy-http-url-input"
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ export default {
|
|||
:label="label"
|
||||
:label-class="labelClass"
|
||||
:label-for="inputId"
|
||||
class="gl-px-3 gl-mb-3 gl-text-left"
|
||||
class="gl-mb-3 gl-px-3 gl-text-left"
|
||||
>
|
||||
<gl-form-input-group
|
||||
:id="inputId"
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ export default {
|
|||
:link="link"
|
||||
:test-id="`${testId}-button`"
|
||||
:data-testid="testId"
|
||||
label-class="gl-font-sm! gl-pt-2!"
|
||||
label-class="!gl-text-sm !gl-pt-2"
|
||||
/>
|
||||
</gl-disclosure-dropdown>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ import { uniqueId } from 'lodash';
|
|||
import { __ } from '~/locale';
|
||||
|
||||
const PREVIEW_COLOR_DEFAULT_CLASSES =
|
||||
'gl-relative gl-w-7 gl-bg-gray-10 gl-rounded-top-left-base gl-rounded-bottom-left-base';
|
||||
'gl-relative gl-w-7 gl-bg-gray-10 gl-rounded-tl-base gl-rounded-bl-base';
|
||||
|
||||
export default {
|
||||
name: 'ColorPicker',
|
||||
|
|
@ -105,12 +105,12 @@ export default {
|
|||
:description="description"
|
||||
:invalid-feedback="invalidFeedback"
|
||||
:state="state"
|
||||
:class="{ 'gl-mb-3!': hasSuggestedColors }"
|
||||
:class="{ '!gl-mb-3': hasSuggestedColors }"
|
||||
>
|
||||
<gl-form-input-group
|
||||
max-length="7"
|
||||
type="text"
|
||||
class="gl-align-center gl-rounded-0 gl-rounded-top-right-base gl-rounded-bottom-right-base gl-max-w-26"
|
||||
class="gl-align-center gl-max-w-26 gl-rounded-none gl-rounded-br-base gl-rounded-tr-base"
|
||||
:value="value"
|
||||
:state="state"
|
||||
@input="handleColorChange"
|
||||
|
|
@ -120,7 +120,7 @@ export default {
|
|||
<gl-form-input
|
||||
:id="id"
|
||||
type="color"
|
||||
class="gl-absolute gl-top-0 gl-left-0 gl-h-full! gl-p-0! gl-m-0! gl-opacity-0"
|
||||
class="gl-absolute gl-left-0 gl-top-0 !gl-m-0 !gl-h-full !gl-p-0 gl-opacity-0"
|
||||
tabindex="-1"
|
||||
:value="value"
|
||||
@input="handleColorChange"
|
||||
|
|
@ -137,7 +137,7 @@ export default {
|
|||
v-gl-tooltip
|
||||
:title="name"
|
||||
:style="{ backgroundColor: hex }"
|
||||
class="gl-rounded-base gl-w-7 gl-h-7 gl-display-inline-block gl-mr-3 gl-mb-3 gl-text-decoration-none"
|
||||
class="gl-mb-3 gl-mr-3 gl-inline-block gl-h-7 gl-w-7 gl-rounded-base gl-no-underline"
|
||||
@click.prevent="handleColorChange(hex)"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,13 +16,13 @@ export default {
|
|||
|
||||
<template>
|
||||
<div>
|
||||
<div class="dropdown-title gl-display-flex gl-align-items-center gl-pt-0 gl-pb-3!">
|
||||
<span class="gl-flex-grow-1">{{ dropdownTitle }}</span>
|
||||
<div class="dropdown-title gl-flex gl-items-center !gl-pb-3 gl-pt-0">
|
||||
<span class="gl-grow">{{ dropdownTitle }}</span>
|
||||
<gl-button
|
||||
:aria-label="__('Close')"
|
||||
variant="link"
|
||||
size="small"
|
||||
class="dropdown-header-button gl-p-0!"
|
||||
class="dropdown-header-button !gl-p-0"
|
||||
icon="close"
|
||||
@click="$emit('closeDropdown')"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -146,7 +146,7 @@ export default {
|
|||
<template>
|
||||
<div class="branch-commit gl-text-primary">
|
||||
<template v-if="shouldShowRefInfo">
|
||||
<div class="icon-container gl-display-inline-block">
|
||||
<div class="icon-container gl-inline-block">
|
||||
<gl-icon v-if="tag" name="tag" />
|
||||
<gl-icon v-else-if="mergeRequestRef" name="merge-request" />
|
||||
<gl-icon v-else name="branch" />
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ export default {
|
|||
<template>
|
||||
<div class="file-container">
|
||||
<div class="file-content">
|
||||
<p class="gl-mt-3 file-info">
|
||||
<p class="file-info gl-mt-3">
|
||||
{{ fileName }}
|
||||
<template v-if="fileSize > 0"> ({{ fileSizeReadable }}) </template>
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -58,13 +58,13 @@ export default {
|
|||
|
||||
<template>
|
||||
<section>
|
||||
<div ref="crudComponent" class="crud gl-bg-subtle gl-border gl-border-default gl-rounded-base">
|
||||
<div ref="crudComponent" class="crud gl-border gl-rounded-base gl-border-default gl-bg-subtle">
|
||||
<header
|
||||
class="gl-flex gl-flex-wrap gl-justify-between gl-gap-x-5 gl-gap-y-2 gl-px-5 gl-py-4 gl-bg-default gl-border-b gl-border-default gl-rounded-t-base"
|
||||
class="gl-border-b gl-flex gl-flex-wrap gl-justify-between gl-gap-x-5 gl-gap-y-2 gl-rounded-t-base gl-border-default gl-bg-default gl-px-5 gl-py-4"
|
||||
>
|
||||
<div class="gl-flex gl-flex-col gl-self-center">
|
||||
<h2
|
||||
class="gl-text-base gl-font-bold gl-leading-24 gl-inline-flex gl-gap-3 gl-m-0"
|
||||
class="gl-m-0 gl-inline-flex gl-gap-3 gl-text-base gl-font-bold gl-leading-24"
|
||||
data-testid="crud-title"
|
||||
>
|
||||
{{ title }}
|
||||
|
|
@ -79,14 +79,14 @@ export default {
|
|||
</h2>
|
||||
<p
|
||||
v-if="description || $scopedSlots.description"
|
||||
class="gl-text-sm gl-text-subtle gl-mt-1 gl-mb-0"
|
||||
class="gl-mb-0 gl-mt-1 gl-text-sm gl-text-subtle"
|
||||
data-testid="crud-description"
|
||||
>
|
||||
<slot v-if="$scopedSlots.description" name="description"></slot>
|
||||
<template v-else>{{ description }}</template>
|
||||
</p>
|
||||
</div>
|
||||
<div class="gl-flex gl-gap-3 gl-items-baseline" data-testid="crud-actions">
|
||||
<div class="gl-flex gl-items-baseline gl-gap-3" data-testid="crud-actions">
|
||||
<gl-button
|
||||
v-if="toggleText"
|
||||
size="small"
|
||||
|
|
@ -100,7 +100,7 @@ export default {
|
|||
|
||||
<div
|
||||
v-if="$scopedSlots.form && isFormVisible"
|
||||
class="gl-p-5 gl-pt-4 gl-bg-default gl-border-b gl-border-default"
|
||||
class="gl-border-b gl-border-default gl-bg-default gl-p-5 gl-pt-4"
|
||||
data-testid="crud-form"
|
||||
>
|
||||
<slot name="form"></slot>
|
||||
|
|
@ -116,7 +116,7 @@ export default {
|
|||
|
||||
<footer
|
||||
v-if="$scopedSlots.footer"
|
||||
class="gl-px-5 gl-py-4 gl-bg-default gl-border-t gl-border-default gl-rounded-b-base"
|
||||
class="gl-border-t gl-rounded-b-base gl-border-default gl-bg-default gl-px-5 gl-py-4"
|
||||
data-testid="crud-footer"
|
||||
>
|
||||
<slot name="footer"></slot>
|
||||
|
|
|
|||
|
|
@ -73,6 +73,6 @@ export default {
|
|||
v-gl-tooltip
|
||||
:class="cssClass"
|
||||
:title="tooltipText"
|
||||
class="deployment-instance gl-flex justify-content-center gl-items-center"
|
||||
class="deployment-instance justify-content-center gl-flex gl-items-center"
|
||||
/>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export default {
|
|||
<transition name="design-disclosure">
|
||||
<aside
|
||||
v-if="open"
|
||||
class="design-disclosure gl-w-full gl-flex gl-flex-col gl-relative gl-border-l gl-z-0 gl-bg-white gl-top-0 gl-right-0 gl-h-full gl-overflow-y-auto"
|
||||
class="design-disclosure gl-border-l gl-relative gl-right-0 gl-top-0 gl-z-0 gl-flex gl-h-full gl-w-full gl-flex-col gl-overflow-y-auto gl-bg-white"
|
||||
>
|
||||
<slot></slot>
|
||||
</aside>
|
||||
|
|
|
|||
|
|
@ -81,7 +81,7 @@ export default {
|
|||
'gl-absolute': position,
|
||||
small: size === 'sm',
|
||||
}"
|
||||
class="gl-display-flex gl-align-items-center gl-justify-content-center gl-font-sm"
|
||||
class="gl-flex gl-items-center gl-justify-center gl-text-sm"
|
||||
type="button"
|
||||
@mousedown="$emit('mousedown', $event)"
|
||||
@mouseup="$emit('mouseup', $event)"
|
||||
|
|
|
|||
|
|
@ -101,7 +101,7 @@ export default {
|
|||
variant="confirm"
|
||||
data-testid="diff-stats-dropdown"
|
||||
class="gl-align-baseline"
|
||||
toggle-class="gl-px-0! !gl-font-bold"
|
||||
toggle-class="!gl-px-0 !gl-font-bold"
|
||||
fluid-width
|
||||
@shown="focusInput"
|
||||
>
|
||||
|
|
@ -118,13 +118,13 @@ export default {
|
|||
</span>
|
||||
</template>
|
||||
<template #list-item="{ item }">
|
||||
<div class="gl-display-flex gl-gap-3 gl-align-items-center gl-overflow-hidden">
|
||||
<gl-icon :name="item.icon" :class="item.iconColor" class="gl-flex-shrink-0" />
|
||||
<div class="gl-flex-grow-1 gl-overflow-hidden">
|
||||
<div class="gl-display-flex">
|
||||
<div class="gl-flex gl-items-center gl-gap-3 gl-overflow-hidden">
|
||||
<gl-icon :name="item.icon" :class="item.iconColor" class="gl-shrink-0" />
|
||||
<div class="gl-grow gl-overflow-hidden">
|
||||
<div class="gl-flex">
|
||||
<span
|
||||
class="gl-font-bold gl-mr-3 gl-flex-grow-1"
|
||||
:class="item.name ? 'gl-text-truncate' : 'gl-italic gl-gray-400'"
|
||||
class="gl-mr-3 gl-grow gl-font-bold"
|
||||
:class="item.name ? 'gl-truncate' : 'gl-gray-400 gl-italic'"
|
||||
>{{ item.text }}</span
|
||||
>
|
||||
<span class="gl-ml-auto gl-whitespace-nowrap" aria-hidden="true">
|
||||
|
|
@ -135,7 +135,7 @@ export default {
|
|||
>{{ additionsText(item.added) }}, {{ deletionsText(item.removed) }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="gl-text-gray-700 gl-overflow-hidden gl-text-overflow-ellipsis">
|
||||
<div class="gl-overflow-hidden gl-text-ellipsis gl-text-gray-700">
|
||||
{{ item.path }}
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -150,10 +150,10 @@ export default {
|
|||
>
|
||||
<gl-sprintf :message="$options.i18n.messageAdditionsDeletions">
|
||||
<template #additions>
|
||||
<span class="gl-text-green-600 gl-font-bold">{{ additionsText() }}</span>
|
||||
<span class="gl-font-bold gl-text-green-600">{{ additionsText() }}</span>
|
||||
</template>
|
||||
<template #deletions>
|
||||
<span class="gl-text-red-500 gl-font-bold">{{ deletionsText() }}</span>
|
||||
<span class="gl-font-bold gl-text-red-500">{{ deletionsText() }}</span>
|
||||
</template>
|
||||
</gl-sprintf>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ export default {
|
|||
|
||||
<template>
|
||||
<div>
|
||||
<div class="gl-display-flex gl-align-items-center">
|
||||
<div class="gl-flex gl-items-center">
|
||||
<slot name="title"></slot>
|
||||
<div class="ml-auto">
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ export default {
|
|||
<span v-else class="dropdown-toggle-text"> {{ toggleText }} </span>
|
||||
<gl-icon
|
||||
v-show="!isLoading"
|
||||
class="gl-absolute gl-top-3 gl-right-3 gl-text-gray-500"
|
||||
class="gl-absolute gl-right-3 gl-top-3 gl-text-gray-500"
|
||||
name="chevron-down"
|
||||
/>
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -148,7 +148,7 @@ export default {
|
|||
<gl-loading-icon
|
||||
v-if="isLoading"
|
||||
size="lg"
|
||||
class="gl-absolute gl-left-0 gl-top-0 gl-right-0"
|
||||
class="gl-absolute gl-left-0 gl-right-0 gl-top-0"
|
||||
/>
|
||||
<template v-else>
|
||||
<template v-if="isSearchEmpty && presetOptions.length > 0">
|
||||
|
|
@ -182,7 +182,7 @@ export default {
|
|||
</slot>
|
||||
</gl-dropdown-item>
|
||||
<slot v-bind="{ isSelected }" name="grouped-options"></slot>
|
||||
<gl-dropdown-item v-if="noOptionsFound" class="gl-pl-6!">
|
||||
<gl-dropdown-item v-if="noOptionsFound" class="!gl-pl-6">
|
||||
{{ $options.i18n.noMatchingResults }}
|
||||
</gl-dropdown-item>
|
||||
<gl-dropdown-item v-if="noOptions">
|
||||
|
|
|
|||
|
|
@ -272,7 +272,7 @@ export default {
|
|||
</li>
|
||||
</template>
|
||||
<li v-else class="dropdown-menu-empty-item">
|
||||
<div class="gl-mr-3 gl-ml-3 gl-mt-5 gl-mb-3">
|
||||
<div class="gl-mb-3 gl-ml-3 gl-mr-3 gl-mt-5">
|
||||
<template v-if="loading">
|
||||
<gl-loading-icon />
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@ export default {
|
|||
<span class="cgreen gl-font-bold">
|
||||
<gl-icon name="file-addition" class="align-text-top" /> {{ file.addedLines }}
|
||||
</span>
|
||||
<span class="gl-text-red-500 gl-font-bold ml-1">
|
||||
<span class="ml-1 gl-font-bold gl-text-red-500">
|
||||
<gl-icon name="file-deletion" class="align-text-top" /> {{ file.removedLines }}
|
||||
</span>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="file-row-header bg-white sticky-top gl-px-2 js-file-row-header" :title="path">
|
||||
<div class="file-row-header bg-white sticky-top js-file-row-header gl-px-2" :title="path">
|
||||
<gl-truncate :text="path" position="middle" class="gl-font-bold" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -403,7 +403,7 @@ export default {
|
|||
:sort-options="transformedSortOptions"
|
||||
:sort-by="sortById"
|
||||
:is-ascending="sortDirectionAscending"
|
||||
class="sort-dropdown-container gl-w-full sm:gl-w-auto sm:!gl-m-0"
|
||||
class="sort-dropdown-container gl-w-full sm:!gl-m-0 sm:gl-w-auto"
|
||||
dropdown-class="gl-grow"
|
||||
dropdown-toggle-class="gl-grow"
|
||||
sort-direction-toggle-class="!gl-shrink !gl-grow-0"
|
||||
|
|
|
|||
|
|
@ -78,8 +78,8 @@ export default {
|
|||
:key="branch.id"
|
||||
:value="branch.name"
|
||||
>
|
||||
<div class="gl-display-flex">
|
||||
<span class="gl-display-inline-block gl-mr-3 gl-p-3"></span>
|
||||
<div class="gl-flex">
|
||||
<span class="gl-mr-3 gl-inline-block gl-p-3"></span>
|
||||
{{ branch.name }}
|
||||
</div>
|
||||
</gl-filtered-search-suggestion>
|
||||
|
|
|
|||
|
|
@ -124,7 +124,7 @@ export default {
|
|||
>
|
||||
<div>
|
||||
<div>{{ getContactName(contact) }}</div>
|
||||
<div class="gl-font-sm">{{ contact.email }}</div>
|
||||
<div class="gl-text-sm">{{ contact.email }}</div>
|
||||
</div>
|
||||
</gl-filtered-search-suggestion>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ export default {
|
|||
<div
|
||||
v-if="datePickerShown"
|
||||
v-outside="handleClickOutside"
|
||||
class="gl-absolute gl-z-1 gl-bg-white gl-border-1 gl-border-gray-200 gl-my-2 gl-p-4 gl-rounded-base gl-shadow-x0-y2-b4-s0 gl-top-full"
|
||||
class="gl-absolute gl-top-full gl-z-1 gl-my-2 gl-rounded-base gl-border-1 gl-border-gray-200 gl-bg-white gl-p-4 gl-shadow-x0-y2-b4-s0"
|
||||
>
|
||||
<gl-daterange-picker
|
||||
:max-date-range="computedConfig.maxDateRange"
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@ export default {
|
|||
:key="getEmojiName(emoji)"
|
||||
:value="getEmojiName(emoji)"
|
||||
>
|
||||
<div class="gl-display-flex">
|
||||
<div class="gl-flex">
|
||||
<gl-emoji class="gl-mr-3" :data-name="getEmojiName(emoji)" />
|
||||
{{ getEmojiName(emoji) }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -171,17 +171,17 @@ export default {
|
|||
:value="getLabelName(label)"
|
||||
>
|
||||
<div
|
||||
class="gl-display-flex gl-align-items-center"
|
||||
class="gl-flex gl-items-center"
|
||||
:class="{ 'gl-pl-6': !selections.includes(label.title) }"
|
||||
>
|
||||
<gl-icon
|
||||
v-if="selections.includes(label.title)"
|
||||
name="check"
|
||||
class="gl-mr-3 gl-text-secondary gl-flex-shrink-0"
|
||||
class="gl-mr-3 gl-shrink-0 gl-text-secondary"
|
||||
/>
|
||||
<span
|
||||
:style="{ backgroundColor: label.color }"
|
||||
class="gl-display-inline-block gl-mr-3 gl-p-3"
|
||||
class="gl-mr-3 gl-inline-block gl-p-3"
|
||||
></span>
|
||||
<div>{{ getLabelName(label) }}</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -151,13 +151,13 @@ export default {
|
|||
:value="getUsername(user)"
|
||||
>
|
||||
<div
|
||||
class="gl-display-flex gl-align-items-center"
|
||||
class="gl-flex gl-items-center"
|
||||
:class="{ 'gl-pl-6': !selections.includes(getUsername(user)) }"
|
||||
>
|
||||
<gl-icon
|
||||
v-if="selections.includes(getUsername(user))"
|
||||
name="check"
|
||||
class="gl-mr-3 gl-text-secondary gl-flex-shrink-0"
|
||||
class="gl-mr-3 gl-shrink-0 gl-text-secondary"
|
||||
/>
|
||||
<gl-avatar :size="32" :src="getAvatarUrl(user)" />
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ export default {
|
|||
variant="danger"
|
||||
@dismiss="$emit('input', [])"
|
||||
>
|
||||
<ul class="gl-pl-5 gl-mb-0">
|
||||
<ul class="gl-mb-0 gl-pl-5">
|
||||
<li v-for="error in errors" :key="error">
|
||||
{{ error }}
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<footer class="gl-mt-5 footer-block">
|
||||
<footer class="footer-block gl-mt-5">
|
||||
<slot name="prepend"></slot>
|
||||
<slot></slot>
|
||||
<slot name="append"></slot>
|
||||
|
|
|
|||
|
|
@ -96,8 +96,7 @@ export default {
|
|||
},
|
||||
formInputClass() {
|
||||
return [
|
||||
// eslint-disable-next-line @gitlab/require-i18n-strings
|
||||
'!gl-font-monospace gl-cursor-default!',
|
||||
'!gl-font-monospace !gl-cursor-default',
|
||||
{ 'input-copy-show-disc': !this.computedValueIsVisible },
|
||||
this.formInputGroupProps.class,
|
||||
];
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<ul class="gl-p-0 gl-list-none">
|
||||
<ul class="gl-list-none gl-p-0">
|
||||
<groups-list-item
|
||||
v-for="group in groups"
|
||||
:key="group.id"
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@ export default {
|
|||
<li class="groups-list-item gl-border-b gl-flex gl-py-5">
|
||||
<div class="gl-grow md:gl-flex">
|
||||
<div class="gl-flex gl-grow gl-items-start">
|
||||
<div v-if="showGroupIcon" class="gl-mr-3 gl-flex gl-h-9 gl-flex-shrink-0 gl-items-center">
|
||||
<div v-if="showGroupIcon" class="gl-mr-3 gl-flex gl-h-9 gl-shrink-0 gl-items-center">
|
||||
<gl-icon class="gl-text-secondary" :name="groupIconName" />
|
||||
</div>
|
||||
<gl-avatar-labeled
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="isPaginationVisible" class="gl-flex gl-justify-center gl-items-center">
|
||||
<div v-if="isPaginationVisible" class="gl-flex gl-items-center gl-justify-center">
|
||||
<gl-keyset-pagination
|
||||
:start-cursor="startCursor"
|
||||
:end-cursor="endCursor"
|
||||
|
|
|
|||
|
|
@ -164,7 +164,7 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<div class="gl-display-inline">
|
||||
<div class="gl-inline">
|
||||
<gl-icon
|
||||
:id="glIconId"
|
||||
ref="icon"
|
||||
|
|
@ -179,12 +179,12 @@ export default {
|
|||
>
|
||||
<template v-if="loading">
|
||||
<gl-loading-icon size="sm" />
|
||||
<p class="gl-mt-4 gl-mb-0 gl-font-small">{{ loadingMessage }}</p>
|
||||
<p class="gl-mb-0 gl-mt-4">{{ loadingMessage }}</p>
|
||||
</template>
|
||||
<template v-else>
|
||||
<ul class="gl-list-none gl-p-0 gl-mb-0">
|
||||
<ul class="gl-mb-0 gl-list-none gl-p-0">
|
||||
<li v-for="(issuable, index) in displayedIssuables" :key="issuable.id">
|
||||
<gl-link :href="issuable.webUrl" class="gl-text-blue-500! gl-font-sm">{{
|
||||
<gl-link :href="issuable.webUrl" class="gl-text-sm !gl-text-blue-500">{{
|
||||
issuable.reference
|
||||
}}</gl-link>
|
||||
<p
|
||||
|
|
@ -204,7 +204,7 @@ export default {
|
|||
<gl-link
|
||||
data-testid="view-all-issues"
|
||||
:href="`${item.webUrl}#related-issues`"
|
||||
class="gl-text-blue-500! gl-font-sm"
|
||||
class="gl-text-sm !gl-text-blue-500"
|
||||
>{{ viewAllIssuablesText }}</gl-link
|
||||
>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ export default {
|
|||
<template>
|
||||
<div class="gl-flex gl-items-center gl-gap-3">
|
||||
<hidden-groups-item v-if="isHiddenGroups" class="gl-grow" />
|
||||
<div v-else class="gl-flex gl-items-center gl-gap-3 gl-grow">
|
||||
<div v-else class="gl-flex gl-grow gl-items-center gl-gap-3">
|
||||
<gl-avatar
|
||||
:alt="fullName"
|
||||
:entity-name="fullName"
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ export default {
|
|||
<template>
|
||||
<a
|
||||
:id="lineId"
|
||||
class="gl-inline-block gl-w-9 gl-pr-2 -gl-ml-9 gl-select-none gl-text-right"
|
||||
class="-gl-ml-9 gl-inline-block gl-w-9 gl-select-none gl-pr-2 gl-text-right"
|
||||
:href="lineHref"
|
||||
>
|
||||
{{ lineNumber }}
|
||||
|
|
|
|||
|
|
@ -115,7 +115,7 @@ export default {
|
|||
@scrollToBottom="onScrollToBottom"
|
||||
><slot name="header-details"></slot>
|
||||
</logs-top-bar>
|
||||
<code class="gl-block gl-bg-black gl-text-base gl-pt-3">
|
||||
<code class="gl-block gl-bg-black gl-pt-3 gl-text-base">
|
||||
<log-line
|
||||
v-for="logLine in logLines"
|
||||
:key="logLine.lineId"
|
||||
|
|
|
|||
|
|
@ -100,10 +100,10 @@ export default {
|
|||
v-if="hoverMap[`code-${index}`]"
|
||||
:title="$options.i18n.copyCodeTitle"
|
||||
:text="block.text"
|
||||
class="gl-absolute gl-top-3 gl-right-3 gl-z-1 gl-duration-medium"
|
||||
class="gl-absolute gl-right-3 gl-top-3 gl-z-1 gl-duration-medium"
|
||||
/>
|
||||
<code-block-highlighted
|
||||
class="gl-border gl-rounded-0! gl-p-4 gl-mb-0 gl-overflow-y-auto"
|
||||
class="gl-border gl-mb-0 gl-overflow-y-auto !gl-rounded-none gl-p-4"
|
||||
:language="block.lang || $options.fallbackLanguage"
|
||||
:code="block.text"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -88,7 +88,7 @@ export default {
|
|||
'gl-border-1',
|
||||
'gl-border-t-solid',
|
||||
'gl-border-gray-100',
|
||||
{ 'gl-display-none': this.isCollapsed },
|
||||
{ 'gl-hidden': this.isCollapsed },
|
||||
];
|
||||
},
|
||||
},
|
||||
|
|
@ -112,12 +112,12 @@ export default {
|
|||
|
||||
<template>
|
||||
<gl-card
|
||||
class="collapsible-card border gl-p-0 gl-mb-5"
|
||||
header-class="gl-display-flex gl-align-items-center gl-border-b-0 gl-py-3"
|
||||
class="collapsible-card border gl-mb-5 gl-p-0"
|
||||
header-class="gl-flex gl-items-center gl-border-b-0 gl-py-3"
|
||||
:body-class="bodyClass"
|
||||
>
|
||||
<gl-modal
|
||||
body-class="gl-pb-0! gl-min-h-6!"
|
||||
body-class="!gl-pb-0 !gl-min-h-6"
|
||||
modal-id="delete-metric-modal"
|
||||
size="sm"
|
||||
:visible="modalVisible"
|
||||
|
|
@ -149,10 +149,10 @@ export default {
|
|||
/>
|
||||
|
||||
<template #header>
|
||||
<div class="gl-w-full gl-display-flex gl-flex-direction-row gl-justify-content-space-between">
|
||||
<div class="gl-display-flex gl-flex-direction-row gl-align-items-center gl-w-full">
|
||||
<div class="gl-flex gl-w-full gl-flex-row gl-justify-between">
|
||||
<div class="gl-flex gl-w-full gl-flex-row gl-items-center">
|
||||
<gl-button
|
||||
class="collapsible-card-btn gl-display-flex gl-text-decoration-none !gl-text-inherit gl-hover-text-blue-800! !gl-shadow-none"
|
||||
class="collapsible-card-btn gl-flex !gl-text-inherit gl-no-underline !gl-shadow-none hover:!gl-text-blue-800"
|
||||
:aria-label="filename"
|
||||
variant="link"
|
||||
category="tertiary"
|
||||
|
|
@ -168,7 +168,7 @@ export default {
|
|||
<span v-else data-testid="metric-image-label-span">{{
|
||||
urlText == null || urlText == '' ? filename : urlText
|
||||
}}</span>
|
||||
<div class="gl-ml-auto btn-group">
|
||||
<div class="btn-group gl-ml-auto">
|
||||
<gl-button
|
||||
v-if="canUpdate"
|
||||
v-gl-tooltip.bottom
|
||||
|
|
@ -191,12 +191,8 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div
|
||||
v-show="!isCollapsed"
|
||||
class="gl-display-flex gl-flex-direction-column"
|
||||
data-testid="metric-image-body"
|
||||
>
|
||||
<img class="gl-max-w-full gl-align-self-center" :src="filePath" />
|
||||
<div v-show="!isCollapsed" class="gl-flex gl-flex-col" data-testid="metric-image-body">
|
||||
<img class="gl-max-w-full gl-self-center" :src="filePath" />
|
||||
</div>
|
||||
</gl-card>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -222,7 +222,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="gl-display-flex gl-justify-content-end gl-w-full" data-testid="merge-request-actions">
|
||||
<div class="gl-flex gl-w-full gl-justify-end" data-testid="merge-request-actions">
|
||||
<gl-disclosure-dropdown
|
||||
id="new-actions-header-dropdown"
|
||||
ref="mrMoreActionsDropdown"
|
||||
|
|
@ -237,10 +237,10 @@ export default {
|
|||
@hidden="hideDropdown"
|
||||
>
|
||||
<template #toggle>
|
||||
<div class="gl-min-h-7 gl-mb-2 gl-sm-mb-0!">
|
||||
<div class="gl-mb-2 gl-min-h-7 sm:!gl-mb-0">
|
||||
<gl-button
|
||||
class="sm:!gl-hidden gl-new-dropdown-toggle gl-w-full"
|
||||
button-text-classes="gl-display-flex gl-justify-content-space-between gl-w-full"
|
||||
class="gl-new-dropdown-toggle gl-w-full sm:!gl-hidden"
|
||||
button-text-classes="gl-flex gl-justify-between gl-w-full"
|
||||
category="secondary"
|
||||
tabindex="0"
|
||||
:aria-label="$options.i18n.mergeRequestActions"
|
||||
|
|
@ -249,7 +249,7 @@ export default {
|
|||
<gl-icon class="dropdown-chevron" name="chevron-down" />
|
||||
</gl-button>
|
||||
<gl-button
|
||||
class="gl-hidden sm:!gl-flex gl-new-dropdown-toggle gl-new-dropdown-icon-only gl-new-dropdown-toggle-no-caret"
|
||||
class="gl-new-dropdown-toggle gl-new-dropdown-icon-only gl-new-dropdown-toggle-no-caret gl-hidden sm:!gl-flex"
|
||||
category="tertiary"
|
||||
icon="ellipsis_v"
|
||||
tabindex="0"
|
||||
|
|
@ -270,7 +270,7 @@ export default {
|
|||
<gl-disclosure-dropdown-group
|
||||
bordered
|
||||
:class="{
|
||||
'gl-mt-0! gl-pt-0! gl-border-t-0!': !isLoggedIn || isNotificationsTodosButtons,
|
||||
'!gl-mt-0 !gl-border-t-0 !gl-pt-0': !isLoggedIn || isNotificationsTodosButtons,
|
||||
}"
|
||||
>
|
||||
<gl-disclosure-dropdown-item
|
||||
|
|
@ -351,7 +351,7 @@ export default {
|
|||
<gl-disclosure-dropdown-group
|
||||
v-if="!isCurrentUser"
|
||||
bordered
|
||||
:class="{ 'gl-mt-0! gl-pt-0! gl-border-t-0!': !canUpdateMergeRequest }"
|
||||
:class="{ '!gl-mt-0 !gl-border-t-0 !gl-pt-0': !canUpdateMergeRequest }"
|
||||
>
|
||||
<gl-disclosure-dropdown-item
|
||||
class="js-report-abuse-dropdown-item"
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ export default {
|
|||
};
|
||||
</script>
|
||||
<template>
|
||||
<gl-tabs class="gl-display-flex gl-w-full" nav-class="gl-border-0!">
|
||||
<gl-tabs class="gl-flex gl-w-full" nav-class="!gl-border-0">
|
||||
<gl-tab
|
||||
v-for="(tab, i) in tabs"
|
||||
:key="i"
|
||||
|
|
|
|||
|
|
@ -186,8 +186,8 @@ export default {
|
|||
:toggle-text="$options.i18n.toggleButtonLabel"
|
||||
variant="confirm"
|
||||
data-testid="new-resource-dropdown"
|
||||
class="gl-display-flex! !gl-w-auto"
|
||||
toggle-class="gl-m-0! !gl-w-auto gl-flex-grow-0!"
|
||||
class="!gl-flex !gl-w-auto"
|
||||
toggle-class="!gl-m-0 !gl-w-auto !gl-grow-0"
|
||||
@click="handleDropdownClick"
|
||||
@shown="handleDropdownShown"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@ export default {
|
|||
<div class="note-header">
|
||||
<div class="note-header-info">
|
||||
<a :href="getUserData.path">
|
||||
<span class="gl-hidden sm:gl-inline-block gl-font-bold">{{ getUserData.name }}</span>
|
||||
<span class="gl-hidden gl-font-bold sm:gl-inline-block">{{ getUserData.name }}</span>
|
||||
<span class="note-headline-light">@{{ getUserData.username }}</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ export default {
|
|||
<template>
|
||||
<timeline-entry-item class="note note-wrapper">
|
||||
<div
|
||||
class="gl-float-left gl-flex gl-justify-center gl-items-center gl-rounded-full -gl-mt-1 gl-ml-2 gl-w-6 gl-h-6 gl-bg-gray-50 gl-text-gray-600"
|
||||
class="gl-float-left -gl-mt-1 gl-ml-2 gl-flex gl-h-6 gl-w-6 gl-items-center gl-justify-center gl-rounded-full gl-bg-gray-50 gl-text-gray-600"
|
||||
></div>
|
||||
<div class="timeline-content">
|
||||
<div class="note-header"></div>
|
||||
|
|
|
|||
|
|
@ -149,10 +149,10 @@ export default {
|
|||
iconBgClass,
|
||||
{
|
||||
'system-note-icon': isAllowedIcon,
|
||||
'system-note-tiny-dot gl-bg-gray-900!': !isAllowedIcon,
|
||||
'system-note-tiny-dot !gl-bg-gray-900': !isAllowedIcon,
|
||||
},
|
||||
]"
|
||||
class="gl-float-left gl-flex gl-justify-center gl-items-center gl-rounded-full gl-relative timeline-icon"
|
||||
class="timeline-icon gl-relative gl-float-left gl-flex gl-items-center gl-justify-center gl-rounded-full"
|
||||
>
|
||||
<gl-icon
|
||||
v-if="isAllowedIcon"
|
||||
|
|
@ -180,7 +180,7 @@ export default {
|
|||
variant="link"
|
||||
:icon="descriptionVersionToggleIcon"
|
||||
data-testid="compare-btn"
|
||||
class="gl-vertical-align-text-bottom gl-font-sm! gl-ml-3"
|
||||
class="gl-ml-3 gl-align-text-bottom !gl-text-sm"
|
||||
@click="toggleDescriptionVersion"
|
||||
>{{ __('Compare with previous version') }}</gl-button
|
||||
>
|
||||
|
|
@ -189,7 +189,7 @@ export default {
|
|||
:icon="showLines ? 'chevron-up' : 'chevron-down'"
|
||||
variant="link"
|
||||
data-testid="outdated-lines-change-btn"
|
||||
class="gl-vertical-align-text-bottom gl-font-sm!"
|
||||
class="gl-align-text-bottom !gl-text-sm"
|
||||
@click="toggleDiff"
|
||||
>
|
||||
{{ __('Compare changes') }}
|
||||
|
|
@ -232,7 +232,7 @@ export default {
|
|||
</div>
|
||||
<div
|
||||
v-if="lines.length && showLines"
|
||||
class="diff-content outdated-lines-wrapper gl-border-solid gl-border-1 gl-border-gray-200 gl-mt-4 gl-rounded-small gl-overflow-hidden"
|
||||
class="diff-content outdated-lines-wrapper gl-mt-4 gl-overflow-hidden gl-rounded-small gl-border-1 gl-border-solid gl-border-gray-200"
|
||||
>
|
||||
<table
|
||||
:class="$options.userColorSchemeClass"
|
||||
|
|
@ -242,19 +242,16 @@ export default {
|
|||
<tr v-for="line in lines" v-once :key="line.line_code" class="line_holder">
|
||||
<td
|
||||
:class="line.type"
|
||||
class="diff-line-num old_line gl-border-bottom-0! gl-border-top-0! gl-border-0! gl-rounded-0!"
|
||||
class="diff-line-num old_line !gl-rounded-none !gl-border-0 !gl-border-b-0 !gl-border-t-0"
|
||||
>
|
||||
{{ line.old_line }}
|
||||
</td>
|
||||
<td
|
||||
:class="line.type"
|
||||
class="diff-line-num new_line gl-border-bottom-0! gl-border-top-0!"
|
||||
>
|
||||
<td :class="line.type" class="diff-line-num new_line !gl-border-b-0 !gl-border-t-0">
|
||||
{{ line.new_line }}
|
||||
</td>
|
||||
<td
|
||||
:class="line.type"
|
||||
class="line_content gl-display-table-cell! gl-border-0! gl-rounded-0!"
|
||||
class="line_content !gl-table-cell !gl-rounded-none !gl-border-0"
|
||||
v-html="line.rich_text /* eslint-disable-line vue/no-v-html */"
|
||||
></td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div
|
||||
class="gl-float-left gl-flex gl-justify-center gl-items-center gl-rounded-full -gl-mt-1 gl-ml-2 gl-w-6 gl-h-6 gl-bg-gray-50 gl-text-gray-600"
|
||||
class="gl-float-left -gl-mt-1 gl-ml-2 gl-flex gl-h-6 gl-w-6 gl-items-center gl-justify-center gl-rounded-full gl-bg-gray-50 gl-text-gray-600"
|
||||
>
|
||||
<slot></slot>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -30,5 +30,5 @@ export const CustomStyles = Template.bind({});
|
|||
CustomStyles.args = {
|
||||
...Default.args,
|
||||
class: 'gl-font-bold',
|
||||
labelClass: 'gl-font-sm gl-text-gray-500',
|
||||
labelClass: 'gl-text-sm gl-text-gray-500',
|
||||
};
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export default {
|
|||
<template>
|
||||
<div>
|
||||
<div
|
||||
class="gl-flex gl-flex-wrap gl-items-center gl-justify-between gl-gap-y-2 gl-gap-x-5 gl-my-5"
|
||||
class="gl-my-5 gl-flex gl-flex-wrap gl-items-center gl-justify-between gl-gap-x-5 gl-gap-y-2"
|
||||
>
|
||||
<h1 class="gl-heading-1 !gl-m-0" data-testid="page-heading">
|
||||
<slot name="heading"></slot>
|
||||
|
|
@ -28,7 +28,7 @@ export default {
|
|||
</div>
|
||||
<div
|
||||
v-if="$scopedSlots.description"
|
||||
class="gl-w-full gl-mt-2 gl-text-secondary"
|
||||
class="gl-mt-2 gl-w-full gl-text-secondary"
|
||||
data-testid="page-heading-description"
|
||||
>
|
||||
<slot name="description"></slot>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
export const tdClass =
|
||||
'table-col gl-display-flex d-md-table-cell gl-align-items-center gl-whitespace-nowrap';
|
||||
export const tdClass = 'table-col gl-flex d-md-table-cell gl-items-center gl-whitespace-nowrap';
|
||||
export const bodyTrClass =
|
||||
'gl-border-1 gl-border-t-solid gl-border-gray-100 gl-hover-cursor-pointer gl-hover-bg-gray-50 gl-hover-border-b-solid';
|
||||
'gl-border-1 gl-border-t-solid gl-border-gray-100 hover:gl-cursor-pointer hover:gl-bg-gray-50 hover:gl-border-b-solid';
|
||||
|
||||
export const defaultPageSize = 20;
|
||||
|
||||
|
|
|
|||
|
|
@ -279,7 +279,7 @@ export default {
|
|||
<span v-safe-html="serverErrorMessage || i18n.errorMsg"></span>
|
||||
</gl-alert>
|
||||
|
||||
<div class="list-header gl-display-flex gl-justify-content-space-between">
|
||||
<div class="list-header gl-flex gl-justify-between">
|
||||
<gl-tabs content-class="gl-p-0" @input="filterItemsByStatus">
|
||||
<gl-tab v-for="tab in statusTabs" :key="tab.status" :data-testid="tab.status">
|
||||
<template #title>
|
||||
|
|
@ -301,13 +301,13 @@ export default {
|
|||
:initial-filter-value="filteredSearchValue"
|
||||
initial-sortby="created_desc"
|
||||
:recent-searches-storage-key="filterSearchKey"
|
||||
:class="{ 'gl-border-bottom-0': showItems }"
|
||||
:class="{ 'gl-border-b-0': showItems }"
|
||||
class="row-content-block"
|
||||
@onFilter="handleFilterItems"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<h4 class="gl-block md:gl-hidden my-3">
|
||||
<h4 class="my-3 gl-block md:gl-hidden">
|
||||
<slot name="title"></slot>
|
||||
</h4>
|
||||
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="gl-display-flex gl-align-items-center">
|
||||
<div class="gl-flex gl-items-center">
|
||||
<local-storage-sync
|
||||
v-if="storageKey"
|
||||
:storage-key="storageKey"
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ export default {
|
|||
<template>
|
||||
<gl-alert variant="danger" :dismissible="false">
|
||||
{{ $options.i18n.genericErrorMessage }}
|
||||
<ul class="gl-mb-0!">
|
||||
<ul class="!gl-mb-0">
|
||||
<li v-for="error in errorMessages" :key="error">
|
||||
{{ error }}
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -46,12 +46,10 @@ export default {
|
|||
<template>
|
||||
<gl-button
|
||||
category="tertiary"
|
||||
class="gl-display-flex gl-align-items-center gl-justify-content-start! gl-mb-2 gl-w-full"
|
||||
class="gl-mb-2 gl-flex gl-w-full gl-items-center !gl-justify-start"
|
||||
@click="onClick"
|
||||
>
|
||||
<div
|
||||
class="gl-display-flex gl-align-items-center gl-flex-wrap project-namespace-name-container"
|
||||
>
|
||||
<div class="project-namespace-name-container gl-flex gl-flex-wrap gl-items-center">
|
||||
<gl-icon v-if="selected" data-testid="selected-icon" name="mobile-issue-close" />
|
||||
<project-avatar
|
||||
:project-id="project.id"
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ export default {
|
|||
data-testid="project-search-field"
|
||||
@input="onInput"
|
||||
/>
|
||||
<div class="gl-flex flex-column">
|
||||
<div class="flex-column gl-flex">
|
||||
<gl-loading-icon v-if="showLoadingIndicator" size="sm" class="py-2 px-4" />
|
||||
<gl-infinite-scroll
|
||||
:max-list-height="maxListHeight"
|
||||
|
|
@ -130,18 +130,18 @@ export default {
|
|||
<span data-testid="legend-text">{{ legendText }}</span>
|
||||
</template>
|
||||
</gl-infinite-scroll>
|
||||
<div v-if="showNoResultsMessage" class="gl-text-gray-600 gl-ml-3 js-no-results-message">
|
||||
<div v-if="showNoResultsMessage" class="js-no-results-message gl-ml-3 gl-text-gray-600">
|
||||
{{ __('Sorry, no projects matched your search') }}
|
||||
</div>
|
||||
<div
|
||||
v-if="showMinimumSearchQueryMessage"
|
||||
class="gl-text-gray-600 gl-ml-3 js-minimum-search-query-message"
|
||||
class="js-minimum-search-query-message gl-ml-3 gl-text-gray-600"
|
||||
>
|
||||
{{ __('Enter at least three characters to search') }}
|
||||
</div>
|
||||
<div
|
||||
v-if="showSearchErrorMessage"
|
||||
class="gl-text-red-500 gl-font-bold gl-ml-3 js-search-error-message"
|
||||
class="js-search-error-message gl-ml-3 gl-font-bold gl-text-red-500"
|
||||
>
|
||||
{{ __('Something went wrong, unable to search projects') }}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<ul class="gl-p-0 gl-list-none">
|
||||
<ul class="gl-list-none gl-p-0">
|
||||
<projects-list-item
|
||||
v-for="project in projects"
|
||||
:key="project.id"
|
||||
|
|
|
|||
|
|
@ -252,7 +252,7 @@ export default {
|
|||
<li class="projects-list-item gl-border-b gl-flex gl-py-5">
|
||||
<div class="gl-grow md:gl-flex">
|
||||
<div class="gl-flex gl-grow gl-items-start">
|
||||
<div v-if="showProjectIcon" class="gl-mr-3 gl-flex gl-h-9 gl-flex-shrink-0 gl-items-center">
|
||||
<div v-if="showProjectIcon" class="gl-mr-3 gl-flex gl-h-9 gl-shrink-0 gl-items-center">
|
||||
<gl-icon class="gl-text-secondary" name="project" />
|
||||
</div>
|
||||
<gl-avatar-labeled
|
||||
|
|
|
|||
|
|
@ -32,10 +32,10 @@ export default {
|
|||
|
||||
<template>
|
||||
<div
|
||||
class="gl-display-flex gl-align-items-top gl-font-monospace gl-font-sm gl-break-all"
|
||||
class="gl-align-items-top gl-flex gl-break-all gl-text-sm gl-font-monospace"
|
||||
:class="[padding, borderClass]"
|
||||
>
|
||||
<div v-if="icon" class="gl-w-5 gl-mr-4">
|
||||
<div v-if="icon" class="gl-mr-4 gl-w-5">
|
||||
<gl-icon :name="icon" />
|
||||
</div>
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ export default {
|
|||
<template>
|
||||
<timeline-entry-item class="system-note note-wrapper">
|
||||
<div
|
||||
class="gl-flex gl-justify-center gl-items-center gl-rounded-full -gl-mt-1 gl-ml-2 gl-w-6 gl-h-6 gl-bg-gray-50 gl-text-gray-600 gl-float-left"
|
||||
class="gl-float-left -gl-mt-1 gl-ml-2 gl-flex gl-h-6 gl-w-6 gl-items-center gl-justify-center gl-rounded-full gl-bg-gray-50 gl-text-gray-600"
|
||||
>
|
||||
<gl-icon :name="icon" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="gl-flex gl-flex-shrink-0 gl-flex-col gl-justify-between gl-text-secondary sm:gl-items-end"
|
||||
class="gl-flex gl-shrink-0 gl-flex-col gl-justify-between gl-text-secondary sm:gl-items-end"
|
||||
>
|
||||
<div
|
||||
v-if="
|
||||
|
|
|
|||
|
|
@ -50,9 +50,9 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="gl-inline-flex gl-align-items-center">
|
||||
<gl-icon v-if="icon" :name="icon" class="gl-text-gray-500 gl-min-w-5 gl-mr-3" />
|
||||
<tooltip-on-truncate v-if="link" :title="text" class="gl-text-truncate" :class="sizeClass">
|
||||
<div class="gl-inline-flex gl-items-center">
|
||||
<gl-icon v-if="icon" :name="icon" class="gl-mr-3 gl-min-w-5 gl-text-gray-500" />
|
||||
<tooltip-on-truncate v-if="link" :title="text" class="gl-truncate" :class="sizeClass">
|
||||
<gl-link :href="link" class="gl-font-bold">
|
||||
{{ text }}
|
||||
</gl-link>
|
||||
|
|
@ -60,10 +60,10 @@ export default {
|
|||
<div
|
||||
v-else
|
||||
data-testid="metadata-item-text"
|
||||
class="gl-font-bold gl-inline-flex"
|
||||
class="gl-inline-flex gl-font-bold"
|
||||
:class="sizeClass"
|
||||
>
|
||||
<tooltip-on-truncate v-if="!textTooltip" :title="text" class="gl-text-truncate">
|
||||
<tooltip-on-truncate v-if="!textTooltip" :title="text" class="gl-truncate">
|
||||
{{ text }}
|
||||
</tooltip-on-truncate>
|
||||
<span v-else v-gl-tooltip="{ title: textTooltip }" data-testid="text-tooltip-container">
|
||||
|
|
|
|||
|
|
@ -126,12 +126,10 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="gl-display-flex gl-flex-direction-column gl-md-flex-direction-row gl-gap-3 row-content-block"
|
||||
>
|
||||
<div class="row-content-block gl-flex gl-flex-col gl-gap-3 md:gl-flex-row">
|
||||
<gl-filtered-search
|
||||
v-model="internalFilter"
|
||||
class="gl-flex-grow-1 gl-min-w-0"
|
||||
class="gl-min-w-0 gl-grow"
|
||||
:placeholder="__('Filter results')"
|
||||
:available-tokens="tokens"
|
||||
@submit="submitSearch"
|
||||
|
|
|
|||
|
|
@ -61,42 +61,37 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="gl-display-flex gl-flex-direction-column">
|
||||
<div
|
||||
class="gl-display-flex gl-flex-wrap gl-sm-flex-nowrap gl-justify-content-space-between gl-py-3"
|
||||
>
|
||||
<div class="gl-flex-direction-column gl-flex-grow-1 gl-min-w-0">
|
||||
<div class="gl-display-flex">
|
||||
<div class="gl-flex gl-flex-col">
|
||||
<div class="gl-flex gl-flex-wrap gl-justify-between gl-py-3 sm:gl-flex-nowrap">
|
||||
<div class="gl-min-w-0 gl-grow gl-flex-col">
|
||||
<div class="gl-flex">
|
||||
<gl-avatar
|
||||
v-if="avatar"
|
||||
:src="avatar"
|
||||
:shape="$options.AVATAR_SHAPE_OPTION_RECT"
|
||||
class="gl-align-self-center gl-mr-4"
|
||||
class="gl-mr-4 gl-self-center"
|
||||
/>
|
||||
|
||||
<div class="gl-display-flex gl-flex-direction-column gl-min-w-0">
|
||||
<h2 class="gl-font-size-h1 gl-mt-3 gl-mb-0" data-testid="title">
|
||||
<div class="gl-flex gl-min-w-0 gl-flex-col">
|
||||
<h2 class="gl-mb-0 gl-mt-3 gl-text-size-h1" data-testid="title">
|
||||
<slot name="title">{{ title }}</slot>
|
||||
</h2>
|
||||
|
||||
<div
|
||||
v-if="$scopedSlots['sub-header']"
|
||||
class="gl-display-flex gl-align-items-center gl-text-gray-500 gl-mt-3"
|
||||
class="gl-mt-3 gl-flex gl-items-center gl-text-gray-500"
|
||||
>
|
||||
<slot name="sub-header"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="metadataSlots.length > 0"
|
||||
class="gl-display-flex gl-flex-wrap gl-align-items-center gl-mt-3"
|
||||
>
|
||||
<div v-if="metadataSlots.length > 0" class="gl-mt-3 gl-flex gl-flex-wrap gl-items-center">
|
||||
<template v-if="!metadataLoading">
|
||||
<div
|
||||
v-for="(row, metadataIndex) in metadataSlots"
|
||||
:key="metadataIndex"
|
||||
class="gl-display-flex gl-align-items-center gl-mr-5"
|
||||
class="gl-mr-5 gl-flex gl-items-center"
|
||||
>
|
||||
<slot :name="row"></slot>
|
||||
</div>
|
||||
|
|
@ -111,10 +106,7 @@ export default {
|
|||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="$scopedSlots['right-actions']"
|
||||
class="gl-display-flex gl-align-items-flex-start gl-gap-3 gl-mt-3"
|
||||
>
|
||||
<div v-if="$scopedSlots['right-actions']" class="gl-mt-3 gl-flex gl-items-start gl-gap-3">
|
||||
<slot name="right-actions"></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -55,12 +55,12 @@ export default {
|
|||
|
||||
<template>
|
||||
<section class="vue-settings-block">
|
||||
<div class="gl-flex gl-justify-between gl-items-start">
|
||||
<div class="gl-flex gl-items-start gl-justify-between">
|
||||
<div class="gl-grow">
|
||||
<h2
|
||||
role="button"
|
||||
tabindex="-1"
|
||||
class="gl-heading-2 gl-cursor-pointer !gl-mb-2"
|
||||
class="gl-heading-2 !gl-mb-2 gl-cursor-pointer"
|
||||
:aria-expanded="ariaExpanded"
|
||||
:aria-controls="collapseId"
|
||||
@click="toggleExpanded"
|
||||
|
|
@ -68,9 +68,9 @@ export default {
|
|||
<slot v-if="$scopedSlots.title" name="title"></slot>
|
||||
<template v-else>{{ title }}</template>
|
||||
</h2>
|
||||
<p class="gl-text-subtle gl-m-0"><slot name="description"></slot></p>
|
||||
<p class="gl-m-0 gl-text-subtle"><slot name="description"></slot></p>
|
||||
</div>
|
||||
<div class="gl-flex-shrink-0 gl-px-2">
|
||||
<div class="gl-shrink-0 gl-px-2">
|
||||
<gl-button
|
||||
class="gl-min-w-12 gl-shrink-0"
|
||||
:aria-expanded="ariaExpanded"
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ export default {
|
|||
</h2>
|
||||
<p
|
||||
v-if="$scopedSlots.description || description"
|
||||
class="gl-text-subtle gl-mb-3"
|
||||
class="gl-mb-3 gl-text-subtle"
|
||||
data-testid="settings-section-description"
|
||||
>
|
||||
<slot v-if="$scopedSlots.description" name="description"></slot>
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="board-labels-toggle-wrapper gl-display-flex gl-align-items-center gl-md-ml-3 gl-h-7">
|
||||
<div class="board-labels-toggle-wrapper gl-flex gl-h-7 gl-items-center md:gl-ml-3">
|
||||
<local-storage-sync :value="isShowingLabels" :storage-key="storageKey" @input="setShowLabels" />
|
||||
<gl-toggle
|
||||
:value="isShowingLabels"
|
||||
|
|
@ -57,7 +57,7 @@ export default {
|
|||
label-position="left"
|
||||
aria-describedby="board-labels-toggle-text"
|
||||
data-testid="show-labels-toggle"
|
||||
class="gl-flex-direction-row"
|
||||
class="gl-flex-row"
|
||||
@change="setShowLabels"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ const createStory = ({ ...options }) => {
|
|||
props: Object.keys(argTypes),
|
||||
template: `
|
||||
<div class="gl-bg-blue-50" :style="{ width }">
|
||||
<tooltip-on-truncate :title="title" :placement="placement" class="gl-block gl-text-truncate">
|
||||
<tooltip-on-truncate :title="title" :placement="placement" class="gl-block gl-truncate">
|
||||
{{title}}
|
||||
</tooltip-on-truncate>
|
||||
</div>
|
||||
|
|
@ -72,8 +72,8 @@ LiveUpdates.argTypes = {
|
|||
export const TruncateTarget = createStory({
|
||||
template: `
|
||||
<div class="gl-bg-black" :style="{ width }">
|
||||
<tooltip-on-truncate class="gl-display-flex" :truncate-target="truncateTarget" :title="title">
|
||||
<div class="gl-m-5 gl-bg-blue-50 gl-text-truncate">
|
||||
<tooltip-on-truncate class="gl-flex" :truncate-target="truncateTarget" :title="title">
|
||||
<div class="gl-m-5 gl-bg-blue-50 gl-truncate">
|
||||
{{ title }}
|
||||
</div>
|
||||
</tooltip-on-truncate>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ export default {
|
|||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="gl-flex gl-flex-shrink-0 gl-flex-col gl-justify-between gl-text-gray-500 sm:gl-items-end"
|
||||
class="gl-flex gl-shrink-0 gl-flex-col gl-justify-between gl-text-gray-500 sm:gl-items-end"
|
||||
>
|
||||
<div
|
||||
v-if="
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue