diff --git a/client/coral-ui/components/Dialog.css b/client/coral-ui/components/Dialog.css
index b5872c12c..9e7700299 100644
--- a/client/coral-ui/components/Dialog.css
+++ b/client/coral-ui/components/Dialog.css
@@ -1,4 +1,3 @@
.dialog {
- position: fixed;
}
diff --git a/client/coral-ui/components/Dialog.js b/client/coral-ui/components/Dialog.js
index d847efaea..bba386026 100644
--- a/client/coral-ui/components/Dialog.js
+++ b/client/coral-ui/components/Dialog.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import dialogPolyfill from 'dialog-polyfill';
import 'dialog-polyfill/dialog-polyfill.css';
import styles from './Dialog.css';
+import {Portal} from 'react-portal';
export default class Dialog extends Component {
static propTypes = {
@@ -53,13 +54,15 @@ export default class Dialog extends Component {
const {children, className = '', onClose, onCancel, open, ...rest} = this.props; // eslint-disable-line
return (
-
+
+
+
);
}
}
diff --git a/package.json b/package.json
index da084504d..de3b617a2 100644
--- a/package.json
+++ b/package.json
@@ -160,6 +160,7 @@
"react-mdl": "^1.7.2",
"react-mdl-selectfield": "^0.2.0",
"react-paginate": "^5.0.0",
+ "react-portal": "^4.1.2",
"react-recaptcha": "^2.2.6",
"react-redux": "^4.4.5",
"react-router": "^3.0.0",
diff --git a/yarn.lock b/yarn.lock
index 282e501e1..c380bcd3a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7473,6 +7473,12 @@ react-paginate@^5.0.0:
prop-types "^15.6.0"
react-addons-create-fragment "^15.0.0"
+react-portal@^4.1.2:
+ version "4.1.2"
+ resolved "https://registry.yarnpkg.com/react-portal/-/react-portal-4.1.2.tgz#7f28f3c8c2ed5c541907c0ed0f24e8996acf627f"
+ dependencies:
+ prop-types "^15.5.8"
+
react-recaptcha@^2.2.6:
version "2.3.5"
resolved "https://registry.yarnpkg.com/react-recaptcha/-/react-recaptcha-2.3.5.tgz#a5db337125bb00fb13c2fa2e4ebfbe8b0cd06bb7"