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) }, 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; 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; - } - } } } 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; diff --git a/styles/sections/_reports.scss b/styles/sections/_reports.scss index 611e28cb..39abad06 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,11 @@ .panel { padding: $gap * 2; - flex-grow: 1; + width: 100%; + + @include ie-only { + max-width: 100%; + } // Spending Summary @@ -38,20 +46,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; } diff --git a/templates/workspaces/reports/index.html b/templates/workspaces/reports/index.html index b87f6bf3..34ae423a 100644 --- a/templates/workspaces/reports/index.html +++ b/templates/workspaces/reports/index.html @@ -365,7 +365,9 @@