diff --git a/app/controllers/application.js b/app/controllers/application.js index 08d04f03..c437b6a6 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -94,6 +94,17 @@ export default class ApplicationController extends Controller.extend( @tracked layerGroupsStorage; + widowResize() { + return new Promise((resolve) => { + setTimeout(() => { + const resizeEvent = window.document.createEvent('UIEvents'); + resizeEvent.initUIEvent('resize', true, false, window, 0); + window.dispatchEvent(resizeEvent); + resolve(); + }, 1); + }); + } + // this action extracts query-param-friendly state of layer groups // for various paramable layers @action @@ -190,7 +201,7 @@ export default class ApplicationController extends Controller.extend( } @action - toggleLeftSideMenuVisibility() { + async toggleLeftSideMenuVisibility() { this.leftSideMenuVisibilty = !this.leftSideMenuVisibilty; const mapContainer = document.querySelector('.map-container'); @@ -199,6 +210,8 @@ export default class ApplicationController extends Controller.extend( mapContainer.setAttribute('class', 'map-container'); else mapContainer.setAttribute('class', 'map-container full-width'); + await this.widowResize(); + this.metrics.trackEvent('MatomoTagManager', { category: 'Toggled Layer Menu Visibility', action: 'Toggled Layer Menu Visibility', diff --git a/app/styles/layouts/_l-default.scss b/app/styles/layouts/_l-default.scss index 43d5f700..9bd1c7ca 100644 --- a/app/styles/layouts/_l-default.scss +++ b/app/styles/layouts/_l-default.scss @@ -97,7 +97,7 @@ body { } &.full-width { - width: 100%; + width: 100% !important; } }