diff options
author | Tim Zallmann <tzallmann@gitlab.com> | 2017-10-05 10:48:06 +0000 |
---|---|---|
committer | Tim Zallmann <tzallmann@gitlab.com> | 2017-10-05 10:48:06 +0000 |
commit | d55216c092fc3d70fc413f74c2f5353fa45bd75a (patch) | |
tree | c1de2e6cc7a5a5007e2c12eb4bcc8bbf883c6d2d /app/assets/javascripts/monitoring | |
parent | dcabf1f982bbcb1ec571ef0da50e6140b8a77b57 (diff) | |
parent | 3130262e880efd4f0df9dd2c62fa0fd23934b0e7 (diff) | |
download | gitlab-ce-d55216c092fc3d70fc413f74c2f5353fa45bd75a.tar.gz |
Merge branch '38031-monitoring-hover-info-is-clipped' into 'master'
Resolve "Monitoring hover info is clipped"
Closes #38031
See merge request gitlab-org/gitlab-ce!14514
Diffstat (limited to 'app/assets/javascripts/monitoring')
-rw-r--r-- | app/assets/javascripts/monitoring/components/graph.vue | 1 | ||||
-rw-r--r-- | app/assets/javascripts/monitoring/components/graph/deployment.vue | 14 |
2 files changed, 14 insertions, 1 deletions
diff --git a/app/assets/javascripts/monitoring/components/graph.vue b/app/assets/javascripts/monitoring/components/graph.vue index 322e083a058..33611c408ef 100644 --- a/app/assets/javascripts/monitoring/components/graph.vue +++ b/app/assets/javascripts/monitoring/components/graph.vue @@ -250,6 +250,7 @@ <graph-deployment :show-deploy-info="showDeployInfo" :deployment-data="reducedDeploymentData" + :graph-width="graphWidth" :graph-height="graphHeight" :graph-height-offset="graphHeightOffset" /> diff --git a/app/assets/javascripts/monitoring/components/graph/deployment.vue b/app/assets/javascripts/monitoring/components/graph/deployment.vue index 3623d2ed946..e3b8be0c7fb 100644 --- a/app/assets/javascripts/monitoring/components/graph/deployment.vue +++ b/app/assets/javascripts/monitoring/components/graph/deployment.vue @@ -19,6 +19,10 @@ type: Number, required: true, }, + graphWidth: { + type: Number, + required: true, + }, }, computed: { @@ -47,6 +51,14 @@ transformDeploymentGroup(deployment) { return `translate(${Math.floor(deployment.xPos) + 1}, 20)`; }, + + positionFlag(deployment) { + let xPosition = 3; + if (deployment.xPos > (this.graphWidth - 200)) { + xPosition = -97; + } + return xPosition; + }, }, }; </script> @@ -77,7 +89,7 @@ <svg v-if="deployment.showDeploymentFlag" class="js-deploy-info-box" - x="3" + :x="positionFlag(deployment)" y="0" width="92" height="60"> |