diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-05-16 21:07:59 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-05-16 21:07:59 +0300 |
commit | fc30a001dafdf318778572b2848002f50882dd73 (patch) | |
tree | a310d0840c6805a82342cb01f2ea23d8907545c0 | |
parent | 00791a1bb7c3b9ce92d5b5a811925ef234758e54 (diff) |
Add latest changes from gitlab-org/gitlab@master
-rw-r--r-- | app/assets/javascripts/alert_management/components/alert_details.vue | 14 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/alerts_list.scss | 7 |
2 files changed, 16 insertions, 5 deletions
diff --git a/app/assets/javascripts/alert_management/components/alert_details.vue b/app/assets/javascripts/alert_management/components/alert_details.vue index 587db1c7200..ace48f25716 100644 --- a/app/assets/javascripts/alert_management/components/alert_details.vue +++ b/app/assets/javascripts/alert_management/components/alert_details.vue @@ -133,30 +133,34 @@ export default { <div v-if="loading"><gl-loading-icon size="lg" class="gl-mt-5" /></div> <div v-if="alert" class="alert-management-details gl-relative"> <div - class="gl-display-flex gl-justify-content-space-between gl-align-items-center gl-px-1 gl-py-6 gl-border-b-1 gl-border-b-gray-200 gl-border-b-solid" + class="gl-display-flex gl-justify-content-space-between gl-align-items-baseline gl-px-1 py-3 py-md-4 gl-border-b-1 gl-border-b-gray-200 gl-border-b-solid flex-column flex-sm-row" > - <div data-testid="alert-header"> + <div + data-testid="alert-header" + class="gl-display-flex gl-align-items-center gl-justify-content-center" + > <div class="gl-display-inline-flex gl-align-items-center gl-justify-content-space-between" > <gl-icon - class="gl-mr-3" + class="gl-mr-3 align-middle" :size="12" :name="`severity-${alert.severity.toLowerCase()}`" :class="`icon-${alert.severity.toLowerCase()}`" /> <strong>{{ $options.severityLabels[alert.severity] }}</strong> </div> - <span class="gl-shim-mx-2">•</span> + <span class="mx-2">•</span> <gl-sprintf :message="reportedAtMessage"> <template #when> - <time-ago-tooltip :time="alert.createdAt" /> + <time-ago-tooltip :time="alert.createdAt" class="gl-ml-3" /> </template> <template #tool>{{ alert.monitoringTool }}</template> </gl-sprintf> </div> <gl-button v-if="glFeatures.createIssueFromAlertEnabled" + class="gl-mt-3 mt-sm-0 align-self-center align-self-sm-baseline" data-testid="createIssueBtn" :href="newIssuePath" category="primary" diff --git a/app/assets/stylesheets/pages/alerts_list.scss b/app/assets/stylesheets/pages/alerts_list.scss index 0561e46bcf1..8eae2b3da1c 100644 --- a/app/assets/stylesheets/pages/alerts_list.scss +++ b/app/assets/stylesheets/pages/alerts_list.scss @@ -97,6 +97,13 @@ } } + @include media-breakpoint-down(xs) { + // TODO Remove in favour of a details CSS page + [data-testid='createIssueBtn'] { + width: 100%; + } + } + .gl-tab-nav-item { color: $gl-gray-600; |