Commit 2cf7628e authored by Ezekiel Kigbo's avatar Ezekiel Kigbo

Tie stage events height to stage nav height

parent 0ddf601a
...@@ -80,7 +80,15 @@ export default { ...@@ -80,7 +80,15 @@ export default {
required: true, required: true,
}, },
}, },
data() {
return {
stageNavHeight: 0,
};
},
computed: { computed: {
stageEventsHeight() {
return `${this.stageNavHeight}px`;
},
stageName() { stageName() {
return this.currentStage ? this.currentStage.title : __('Related Issues'); return this.currentStage ? this.currentStage.title : __('Related Issues');
}, },
...@@ -141,6 +149,9 @@ export default { ...@@ -141,6 +149,9 @@ export default {
return {}; return {};
}, },
}, },
mounted() {
this.$set(this, 'stageNavHeight', this.$refs.stageNav.clientHeight);
},
methods: { methods: {
medianValue(id) { medianValue(id) {
return this.medians[id] ? this.medians[id] : null; return this.medians[id] ? this.medians[id] : null;
...@@ -167,7 +178,7 @@ export default { ...@@ -167,7 +178,7 @@ export default {
</nav> </nav>
</div> </div>
<div class="stage-panel-body"> <div class="stage-panel-body">
<nav class="stage-nav"> <nav ref="stageNav" class="stage-nav">
<ul> <ul>
<stage-nav-item <stage-nav-item
v-for="stage in stages" v-for="stage in stages"
...@@ -189,7 +200,7 @@ export default { ...@@ -189,7 +200,7 @@ export default {
/> />
</ul> </ul>
</nav> </nav>
<div class="section stage-events"> <div class="section stage-events" :style="{ height: stageEventsHeight }">
<gl-loading-icon v-if="isLoading" class="mt-4" size="md" /> <gl-loading-icon v-if="isLoading" class="mt-4" size="md" />
<custom-stage-form <custom-stage-form
v-else-if="isCreatingCustomStage || isEditingCustomStage" v-else-if="isCreatingCustomStage || isEditingCustomStage"
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment