Update map width when toggling sidebar

NYCPlanning · Apr 25, 2024 · f788700 · f788700
1 parent 680ba61
commit f788700
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/app/controllers/application.js b/app/controllers/application.js
@@ -122,6 +122,12 @@ export default class ApplicationController extends Controller.extend(
   toggleLeftSideMenuVisibility() {
     this.leftSideMenuVisibilty = !this.leftSideMenuVisibilty;
 
+    const mapContainer = document.querySelector('.map-container');
+
+    if (this.leftSideMenuVisibilty)
+      mapContainer.setAttribute('class', 'map-container');
+    else mapContainer.setAttribute('class', 'map-container full-width');
+
     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
@@ -95,6 +95,11 @@ body {
   @include breakpoint(xlarge) {
     width: calc(100% - 18rem);
   }
+
+  &.full-width {
+      width: 100%;
+  }
+
 }
 
 body.index {
@@ -193,7 +198,7 @@ body.index {
     );
   }
 
-  & > .close-button {
+  & .close-button {
     position: relative;
     margin: 0;