🔀 merge

Author: ghalestrilo

client/components/mobile/FloatingNav.jsx

@@ -6,7 +6,7 @@ import Button from '../../common/Button';
 import IconButton from './IconButton';
 
 const FloatingContainer = styled.div`
-  position: absolute;
+  position: fixed;
   right: ${remSize(16)};
   top: ${remSize(80)};
 

client/components/mobile/Sidebar.jsx

@@ -12,7 +12,7 @@ const SidebarWrapper = styled.div`
   height: 100%;
   width: ${remSize(180)};
 
-  position: absolute;
+  position: fixed;
   z-index: 2;
   left: 0;
 

client/components/useAsModal.jsx

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 import { useModalBehavior } from '../utils/custom-hooks';
 
 const BackgroundOverlay = styled.div`
-  position: absolute;
+  position: fixed;
   z-index: 2;
   width: 100% !important;
   height: 100% !important;

client/modules/App/App.jsx

@@ -18,7 +18,9 @@ class App extends React.Component {
 
   componentWillReceiveProps(nextProps) {
     const locationWillChange = nextProps.location !== this.props.location;
-    const shouldSkipRemembering = nextProps.location.state && nextProps.location.state.skipSavingPath === true;
+    const shouldSkipRemembering =
+      nextProps.location.state &&
+      nextProps.location.state.skipSavingPath === true;
 
     if (locationWillChange && !shouldSkipRemembering) {
       this.props.setPreviousPath(this.props.location.pathname);
@@ -34,9 +36,10 @@ class App extends React.Component {
   render() {
     return (
       <div className="app">
-        <div style={{ display: 'none' }}>
-          {this.state.isMounted && !window.devToolsExtension && getConfig('NODE_ENV') === 'development' && <DevTools />}
-        </div>
+        {false &&
+          this.state.isMounted &&
+          !window.devToolsExtension &&
+          getConfig('NODE_ENV') === 'development' && <DevTools />}
         {this.props.children}
       </div>
     );
@@ -57,7 +60,7 @@ App.propTypes = {
 
 App.defaultProps = {
   children: null,
-  theme: 'light'
+  theme: 'light',
 };
 
 const mapStateToProps = state => ({

client/utils/custom-hooks.js

@@ -28,7 +28,7 @@ export const useModalBehavior = (hideOverlay) => {
 
 
   const handleClickOutside = ({ target }) => {
-    if (ref && ref.current && !ref.current.contains(target)) {
+    if (ref && ref.current && !(ref.current.contains && ref.current.contains(target))) {
       hide();
     }
   };