Mobile map fix when listingId provided in URL

web/dist/main.css

@@ -74,10 +74,8 @@ html {
 
 .right-content {
   /*overflow-y: auto;*/
-
+  overflow-y: scroll; /* has to be scroll, not auto */
-    overflow-y: scroll; /* has to be scroll, not auto */
+  -webkit-overflow-scrolling: touch;
-
-      -webkit-overflow-scrolling: touch;
   height: 100%;
   padding: 10px 10px 0;
 }
@@ -86,7 +84,7 @@ html {
   box-sizing: border-box;
   width: 572px;
   padding-top: 60px;
-  float: right;
+  /*float: right;*/
   height: 100%;
   border: 1px solid #e6e6e6;
   background: rgba(252,252,253,.9);
@@ -498,8 +496,8 @@ html {
   }
 
   .left-hidden {
-    position: absolute;
+    /*position: absolute;*/
-    left: -100%;
+    /*left: -100%;*/
   }
 
   .right-shown {

web/src/components/Main.js

@@ -133,6 +133,7 @@ class Main extends React.Component {
           maxZoom: parseInt(this.state.zoom),
           minZoom: parseInt(this.state.zoom)
         })
+
         map.fitBounds(initialBounds)
         map.setOptions({maxZoom: originalMaxZoom, minZoom: originalMinZoom})
       }
@@ -167,19 +168,6 @@ class Main extends React.Component {
     control.index = 1
     map.controls[google.maps.ControlPosition.TOP_RIGHT].push(control)
     this.map = map
-
-    // TODO: if state contains listingId reload
-    if (this.state.listingId) {
-      loadListing(this.state.listingId).then(l => l.text()).then(l => {
-        this.dispatch({
-          type: 'VIEW_LISTING_DETAILS',
-          action: {
-            id: this.state.listingId,
-            listing: JSON.parse(l)
-          }
-        })
-      })
-    }
   }
 
   removeAllMarkers () {

web/src/lib/helpers.js

@@ -36,3 +36,5 @@ export const listingUrl = (id) => {
   // TODO: fix this once removing hardcoded values
   return `http://localhost:8080/?listingId=${id}`
 }
+
+export const isMobile = () => window.matchMedia("(max-width: 768px)").matches