diff --git a/web/dist/main.css b/web/dist/main.css index 76b3359..d6d86a9 100644 --- a/web/dist/main.css +++ b/web/dist/main.css @@ -84,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); @@ -466,6 +466,7 @@ html { #right { width: 100%; + float: none; } .filters-btn-toggle { @@ -495,11 +496,6 @@ html { display: block; } - .left-hidden { - /*position: absolute;*/ - /*left: -100%;*/ - } - .right-shown { display: block; } @@ -508,8 +504,14 @@ html { display: none; } + + .left-absolute { + position:absolute; + } + .left-base { display: block; + position: static; } #header .title { diff --git a/web/src/components/Main.js b/web/src/components/Main.js index df3237b..55abdfd 100644 --- a/web/src/components/Main.js +++ b/web/src/components/Main.js @@ -6,6 +6,7 @@ import {pacSelectFirst} from '../helpers/googleMaps' import {loadProperties, loadSeen, loadListing} from '../lib/api' import {handleMessage} from '../lib/handlers' import Router from '../lib/router' +import {isMobile} from '../lib/helpers' class Main extends React.Component { constructor (props) { @@ -136,6 +137,10 @@ class Main extends React.Component { map.fitBounds(initialBounds) map.setOptions({maxZoom: originalMaxZoom, minZoom: originalMinZoom}) + if (isMobile()) { + document.getElementById('left').classList.add("left-absolute"); + this.addAbsoluteLeftInRender = true; + } } }) map.addListener('idle', regularIdle) @@ -573,7 +578,7 @@ class Main extends React.Component { let rightClass = 'right-base' if (this.state.listingId || this.state.mapClicked) { - leftClass = 'left-hidden' + leftClass = this.addAbsoluteLeftInRender ? 'left-absolute' : '' rightClass = 'right-shown' }