💄 update some styles to position: fixed

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/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();
     }
   };