Fixed message dialog

website/src/ui/Modal.js

@@ -8,16 +8,23 @@ class Modal extends Component {
   static propTypes = {
     children: PropTypes.node,
     open: PropTypes.bool,
-    // TODO: onCancel: PropTypes.func,
+    width: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]),
+    // TODO: onCancel: PropTypes.func <- for handling ESC & enter key
+  }
+
+  static defaultProps = {
+    width: '60%',
   }
 
   // TODO: Capture ESC key https://stackoverflow.com/questions/3369593/how-to-detect-escape-key-press-with-pure-js-or-jquery
 
   render() {
+    const { open, children, width } = this.props
+
     return (
-      <Dimmer active={this.props.open}>
-        <div style={style.modal}>
-          {this.props.children}
+      <Dimmer active={open}>
+        <div style={[style.modal, { width }]}>
+          {children}
         </div>
       </Dimmer>
     )