misc fix

src/app/ui/modaldialog.js

@@ -21,6 +21,8 @@ var css = csjs`
     padding: 2px 16px;
     background-color: ${styles.colors.orange};
     color: ${styles.colors.white};
+    display: flex;
+    justify-content: space-between;
   }
   .modalBody {
     padding: 1.5em;
@@ -51,9 +53,12 @@ var css = csjs`
   }
   .modalFooterOk {
     cursor: pointer;
+    color: #393939;
   }
   .modalFooterCancel {
+    margin-left: 1em;
     cursor: pointer;
+    color: #393939;
   }
   .modalClose {
     margin: auto 0;
@@ -109,6 +114,7 @@ module.exports = (title, content, ok, cancel) => {
 
   function hide () {
     container.style.display = 'none'
+    container.parentElement.removeChild(container)
   }
 
   function show () {
@@ -127,8 +133,8 @@ module.exports = (title, content, ok, cancel) => {
 }
 
 function html () {
-  return yo`<div id="modal-dialog" class="${css.modal}" onclick="clickModal()" >
-  <div class="${css['modalContent']}">
+  return yo`<div id="modal-dialog" class="${css.modal}">
+  <div class="${css['modalContent']}">  
     <div class="${css['modalHeader']}">
     <h2></h2>
     <i id="modal-close" title="Close" class="fa fa-times ${css['modalClose']}" aria-hidden="true"></i>
@@ -136,7 +142,7 @@ function html () {
   <div class="${css['modalBody']}"> -
   </div>
   <div class="${css['modalFooter']}">
-    <span id="modal-footer-ok" class="modalFooterOk">OK</span><span id="modal-footer-cancel" class="modalFooterCancel">Cancel</span>
+    <span id="modal-footer-ok" class=${css['modalFooterOk']}>OK</span><span id="modal-footer-cancel"  class=${css['modalFooterCancel']}>Cancel</span>
         </div>
   </div>
   </div>