diff options
| author | Brandon Labuschagne <blabuschagne@gitlab.com> | 2019-11-15 14:39:29 +0000 |
|---|---|---|
| committer | Aakriti Gupta <agupta@gitlab.com> | 2019-11-20 10:36:19 +0100 |
| commit | a416b83b6c0e1b8db9dd9829d16ca420bdb2fbe9 (patch) | |
| tree | 24b03e0a11d8bc608e8d57f25482de6d90c3a82c /app | |
| parent | 9e674f92a3e3f2c4f524517cfa31864525844095 (diff) | |
| download | gitlab-ce-a416b83b6c0e1b8db9dd9829d16ca420bdb2fbe9.tar.gz | |
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.
Diffstat (limited to 'app')
| -rw-r--r-- | app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js | 6 | ||||
| -rw-r--r-- | 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) }} |