Fix: Disappearing modal (elastic#527)

* fix: modal z-index via css specificity * fix: prevent click backdrop to close this wasn't expected behavior anyway
w33ble · May 4, 2018 · 3e285e0 · 3e285e0
1 parent d097ade
commit 3e285e0
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 0 deletions.
diff --git a/public/components/confirm_modal/confirm_modal.js b/public/components/confirm_modal/confirm_modal.js
@@ -30,6 +30,7 @@ export const ConfirmModal = props => {
       show
       className={`canvas__confirm_modal ${className || ''}`}
       onHide={cancel}
+      backdrop="static"
       aria-labelledby="confirm-modal-title"
     >
       <Modal.Header>

diff --git a/public/style/hackery.less b/public/style/hackery.less
@@ -56,3 +56,15 @@ button:focus {
 .popover {
   max-width: 2000px !important; // React-Bootstrap popovers are hardcoded to 276px;
 }
+
+// fix modal focus index, set to bootstrap values
+// broken upstream by focus mixin: https://github.com/elastic/kibana/blob/d77cc5676bc534c1d1de1f160e213bd66fb8a78c/packages/kbn-ui-framework/src/global_styling/reset/_reset.scss
+[role="dialog"] {
+  .modal-backdrop {
+    z-index: 1040;
+  }
+
+  .modal {
+    z-index: 1050;
+  }
+}