From b3076997eb00021004063cf552fb07bbd117e81a Mon Sep 17 00:00:00 2001
From: Brandon Labuschagne <blabuschagne@gitlab.com>
Date: Fri, 15 Nov 2019 14:39:29 +0000
Subject: [PATCH] Ensure that summary items remain aligned
Default number of items is 3. If this is not the case,
then increase the column width of the summary items
to cater for 2 items plus the date filter.
---
.../javascripts/cycle_analytics/cycle_analytics_bundle.js | 6 ++++++
app/views/projects/cycle_analytics/show.html.haml | 4 ++--
2 files changed, 8 insertions(+), 2 deletions(-)
diff --git a/app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js b/app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js
index cd67ba5fab8..1074ce0e744 100644
--- a/app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js
+++ b/app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js
@@ -58,10 +58,16 @@ export default () => {
service: this.createCycleAnalyticsService(cycleAnalyticsEl.dataset.requestPath),
};
},
+ defaultNumberOfSummaryItems: 3,
computed: {
currentStage() {
return this.store.currentActiveStage();
},
+ summaryTableColumnClass() {
+ return this.state.summary.length === this.$options.defaultNumberOfSummaryItems
+ ? 'col-sm-3'
+ : 'col-sm-4';
+ },
},
created() {
// Conditional check placed here to prevent this method from being called on the
diff --git a/app/views/projects/cycle_analytics/show.html.haml b/app/views/projects/cycle_analytics/show.html.haml
index 7fedd1ab785..1691af9dfdd 100644
--- a/app/views/projects/cycle_analytics/show.html.haml
+++ b/app/views/projects/cycle_analytics/show.html.haml
@@ -13,10 +13,10 @@
.content-block
.container-fluid
.row
- .col-sm-3.col-12.column{ "v-for" => "item in state.summary" }
+ .col-12.column{ "v-for" => "item in state.summary", ":class" => "summaryTableColumnClass" }
%h3.header {{ item.value }}
%p.text {{ item.title }}
- .col-sm-3.col-12.column
+ .col-12.column{ ":class" => "summaryTableColumnClass" }
.dropdown.inline.js-ca-dropdown
%button.dropdown-menu-toggle{ "data-toggle" => "dropdown", :type => "button" }
%span.dropdown-label {{ n__('Last %d day', 'Last %d days', 30) }}
--
2.30.9