diff options
| author | Annabel Dunstone Gray <annabel.dunstone@gmail.com> | 2018-07-16 17:13:22 -0500 |
|---|---|---|
| committer | Annabel Dunstone Gray <annabel.dunstone@gmail.com> | 2018-07-16 17:28:58 -0500 |
| commit | f79e6340767d2be2bd1bbbf51511082852029ca9 (patch) | |
| tree | 202904024d517610bb94d21656f42481ad762d26 | |
| parent | bbad5174eb425337f6c10fd66ac057e1ce78cd45 (diff) | |
| download | gitlab-ce-41784-monitoring-graph-popovers.tar.gz | |
Fix monitoring poppers41784-monitoring-graph-popovers
| -rw-r--r-- | app/assets/javascripts/monitoring/components/graph/flag.vue | 1 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/environments.scss | 18 | ||||
| -rw-r--r-- | changelogs/unreleased/41784-monitoring-graph-popovers.yml | 5 |
3 files changed, 19 insertions, 5 deletions
diff --git a/app/assets/javascripts/monitoring/components/graph/flag.vue b/app/assets/javascripts/monitoring/components/graph/flag.vue index 92fe98508ad..1e6803abf3a 100644 --- a/app/assets/javascripts/monitoring/components/graph/flag.vue +++ b/app/assets/javascripts/monitoring/components/graph/flag.vue @@ -125,6 +125,7 @@ export default { :class="flagOrientation" class="prometheus-graph-flag popover" > + <div class="arrow-shadow"></div> <div class="arrow"></div> <div class="popover-title"> <h5 v-if="deploymentFlagData"> diff --git a/app/assets/stylesheets/pages/environments.scss b/app/assets/stylesheets/pages/environments.scss index 37017e85b7a..8915b323b3c 100644 --- a/app/assets/stylesheets/pages/environments.scss +++ b/app/assets/stylesheets/pages/environments.scss @@ -294,7 +294,7 @@ display: block; min-width: 160px; border: 0; - box-shadow: 0 1px 4px 0 rgba(0,0,0,0.30); + box-shadow: 0 1px 4px 0 $black-transparent; h5 { padding: 0; @@ -330,6 +330,11 @@ border-bottom: 6px solid transparent; border-left: 4px solid $theme-gray-50; } + + .arrow-shadow { + right: -3px; + box-shadow: 1px 0 9px 0 $black-transparent; + } } &.right { @@ -347,6 +352,11 @@ border-bottom: 6px solid transparent; border-right: 4px solid $theme-gray-50; } + + .arrow-shadow { + left: -3px; + box-shadow: 1px 0 8px 0 $black-transparent; + } } > .arrow { @@ -359,11 +369,9 @@ position: absolute; width: 7px; height: 7px; - background: transparent; + background-color: transparent; transform: rotate(45deg); - top: 12px; - left: -3px; - box-shadow: 0px 0px 8px -1px rgba(0,0,0,0.30); + top: 13px; } > .popover-title, diff --git a/changelogs/unreleased/41784-monitoring-graph-popovers.yml b/changelogs/unreleased/41784-monitoring-graph-popovers.yml new file mode 100644 index 00000000000..757445d7e0c --- /dev/null +++ b/changelogs/unreleased/41784-monitoring-graph-popovers.yml @@ -0,0 +1,5 @@ +--- +title: Update design for system metrics popovers +merge_request: 20655 +author: +type: fixed |