fix modal zindex

3 files changed, 17 insertions, 24 deletions

diff --git a/frontend/src/components/modals/PasswordModal.js b/frontend/src/components/modals/PasswordModal.js
index bf25eeb..637e20a 100644
--- a/frontend/src/components/modals/PasswordModal.js
+++ b/frontend/src/components/modals/PasswordModal.js
@@ -1,20 +1,9 @@
 import React, { useRef } from 'react';
 import Modal from 'react-modal';
 import { Password } from '../Inputs'
-import { RightPad, LeftPad, ModalHeader, Padding } from './shared'
+import {RightPad, LeftPad, ModalHeader, Padding, modalStyles} from './shared'
 import Error from '../Err';
 
-const modalStyles = {
-    content: {
-        top: '50%',
-        left: '50%',
-        transform: 'translate(-50%, -50%)',
-        width: '400px',
-        height: '250px',
-        border: '1px solid #11111188'
-    }
-};
-
 const PasswordModal = (props) => {
     const ErrorLabel = useRef(null);
     Modal.setAppElement('body');
diff --git a/frontend/src/components/modals/PasteModal.js b/frontend/src/components/modals/PasteModal.js
index 6c74e19..c91bbb4 100644
--- a/frontend/src/components/modals/PasteModal.js
+++ b/frontend/src/components/modals/PasteModal.js
@@ -1,21 +1,10 @@
 import React from 'react';
 import Modal from 'react-modal';
-import { LeftPad, ModalHeader, RightPad } from './shared'
+import {LeftPad, ModalHeader, modalStyles, RightPad} from './shared'
 import { useHistory } from 'react-router-dom';
 import { Text } from '../Inputs'
 import { useClipboard } from 'use-clipboard-copy';
 
-const modalStyles = {
-    content: {
-        top: '50%',
-        left: '50%',
-        transform: 'translate(-50%, -50%)',
-        width: '500px',
-        height: '250px',
-        border: '1px solid #11111188'
-    }
-};
-
 const PasteModal = (props) => {
     const history = useHistory();
     const fullURL = `${window.location.origin}/${props.hash}`;
diff --git a/frontend/src/components/modals/shared.js b/frontend/src/components/modals/shared.js
index d63be06..7c38dc2 100644
--- a/frontend/src/components/modals/shared.js
+++ b/frontend/src/components/modals/shared.js
@@ -1,5 +1,20 @@
 import styled from 'styled-components'
 
+export const modalStyles = {
+  content: {
+    top: '50%',
+    left: '50%',
+    transform: 'translate(-50%, -50%)',
+    width: '500px',
+    height: '250px',
+    border: '1px solid #11111188',
+  },
+};
+
+export const Form = styled.form`
+  z-index: 999;
+`
+
 export const RightPad = styled.div`
     margin-right: 3em;
 `