From c88f2a1a564e047ffe47cff88ec01e4fe7971736 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 11:46:42 -0400 Subject: [PATCH 1/7] add missing fallback meter --- templates/workspaces/reports/index.html | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/templates/workspaces/reports/index.html b/templates/workspaces/reports/index.html index b32543d2..2be042f8 100644 --- a/templates/workspaces/reports/index.html +++ b/templates/workspaces/reports/index.html @@ -365,7 +365,9 @@ {{ workspace_totals.get(prev_month_index, 0) | dollars }} {{ workspace_totals.get(current_month_index, 0) | dollars }} - + +
+ From fab5b3341d6c141f66afa0ffd11b0395a05c3ea7 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 13:03:04 -0400 Subject: [PATCH 2/7] Add max widths to empty state --- styles/components/_empty_state.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/styles/components/_empty_state.scss b/styles/components/_empty_state.scss index 6117484b..39d122de 100644 --- a/styles/components/_empty_state.scss +++ b/styles/components/_empty_state.scss @@ -4,6 +4,7 @@ display: flex; flex-direction: column; align-items: center; + max-width: 100%; @include media($medium-screen) { padding: 8rem ($gap * 4) 0; @@ -28,6 +29,7 @@ .empty-state__sub-message { @include h4; color: $color-gray; + max-width: 100%; @include media($large-screen) { @include h3; From 653d8c8e8b1c820673fb3da2acb4007f88c7e455 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 13:25:34 -0400 Subject: [PATCH 3/7] budget reports layout adjustments for IE only --- styles/sections/_reports.scss | 23 ++++++++++++++++++++++- 1 file changed, 22 insertions(+), 1 deletion(-) diff --git a/styles/sections/_reports.scss b/styles/sections/_reports.scss index 611e28cb..76976fa5 100644 --- a/styles/sections/_reports.scss +++ b/styles/sections/_reports.scss @@ -14,6 +14,10 @@ flex-direction: row; flex-basis: 50%; + @include ie-only { + max-width: 50%; + } + &:first-child { padding-left: 0; } @@ -26,7 +30,10 @@ .panel { padding: $gap * 2; - flex-grow: 1; + + @include ie-only { + max-width: 100%; + } // Spending Summary @@ -38,20 +45,34 @@ .row { justify-content: space-between; + + @include ie-only { + max-width: 100%; + flex-wrap: wrap; + } } .spend-summary__heading { @include h3; margin: 0 $gap 0 0; + -ms-flex-negative: 1; } .spend-summary__budget { margin: 0 0 0 $gap; + @include ie-only { + margin: $gap 0 0 0; + } + > div { text-align: right; margin: 0 0 ($gap / 2) 0; + @include ie-only { + text-align: left; + } + dd, dt { display: inline; } From fd153dc39e952d489bef5fbe044c2e8f8407a9a4 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 13:32:13 -0400 Subject: [PATCH 4/7] Fix overflowing layout issue in IE. --- styles/components/_global_layout.scss | 17 +---------------- 1 file changed, 1 insertion(+), 16 deletions(-) diff --git a/styles/components/_global_layout.scss b/styles/components/_global_layout.scss index f4b2aa12..1394d789 100644 --- a/styles/components/_global_layout.scss +++ b/styles/components/_global_layout.scss @@ -24,25 +24,10 @@ max-width: $site-max-width; overflow-x: hidden; flex-grow: 1; - - @include ie-only { - max-width: 85%; - } + -ms-flex-negative: 1; @include media($medium-screen) { margin: $gap * 2; } - - @include media($large-screen) { - @include ie-only { - max-width: 80%; - } - } - - @include media($xlarge-screen) { - @include ie-only { - max-width: $site-max-width; - } - } } } From b34d9b471e25f6ec2f7608c9dddba793167df48e Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 13:41:59 -0400 Subject: [PATCH 5/7] set metrics again after page load. this SEEMS to fix an issue in IE where page metrics are measured incorrectly on the initial run --- js/components/charts/budget_chart.js | 1 + 1 file changed, 1 insertion(+) diff --git a/js/components/charts/budget_chart.js b/js/components/charts/budget_chart.js index a645acdc..21e6465c 100644 --- a/js/components/charts/budget_chart.js +++ b/js/components/charts/budget_chart.js @@ -34,6 +34,7 @@ export default { mounted: function () { this._setDisplayedMonths() this._setMetrics() + addEventListener('load', this._setMetrics) addEventListener('resize', this._setMetrics) }, From c12d58b8c723cec4ba54aab1f8db1a0e75ec60a4 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Thu, 27 Sep 2018 14:10:40 -0400 Subject: [PATCH 6/7] panel width in budget chart --- styles/sections/_reports.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/styles/sections/_reports.scss b/styles/sections/_reports.scss index 76976fa5..39abad06 100644 --- a/styles/sections/_reports.scss +++ b/styles/sections/_reports.scss @@ -30,6 +30,7 @@ .panel { padding: $gap * 2; + width: 100%; @include ie-only { max-width: 100%; From fe6e05ece4fa47dd2d1a2e349b010515aa256620 Mon Sep 17 00:00:00 2001 From: Andrew Croce Date: Mon, 1 Oct 2018 09:21:51 -0400 Subject: [PATCH 7/7] fix workspace header layout in IE --- styles/components/_topbar.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles/components/_topbar.scss b/styles/components/_topbar.scss index 7e91387e..92b3a2e5 100644 --- a/styles/components/_topbar.scss +++ b/styles/components/_topbar.scss @@ -58,7 +58,6 @@ flex-direction: row; align-items: stretch; justify-content: flex-end; - -ms-flex-pack: start; .topbar__link--workspace { &:first-child { @@ -68,6 +67,7 @@ &.topbar__context--workspace { background-color: $color-primary; + -ms-flex-pack: start; .topbar__link { color: $color-white;