fix ErrorViewer modal

src/client/js/components/Admin/ImportData/GrowiArchive/ErrorViewer.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
-import Modal from 'react-bootstrap/es/Modal';
+import { Modal, ModalHeader, ModalBody } from 'reactstrap';
 
 import { createSubscribedElement } from '../../../UnstatedUtils';
 
@@ -20,13 +20,13 @@ class ErrorViewer extends React.Component {
     }
 
     return (
-      <Modal show={this.props.isOpen} onHide={this.props.onClose}>
-        <Modal.Header closeButton className="bg-danger">
-          <Modal.Title className="text-white">Errors</Modal.Title>
-        </Modal.Header>
-        <Modal.Body>
+      <Modal isOpen={this.props.isOpen} toggle={this.props.onClose}>
+        <ModalHeader toggle={this.props.onClose} className="bg-danger text-white">
+          Errors
+        </ModalHeader>
+        <ModalBody>
           <textarea className="form-control" rows="8" readOnly wrap="off" defaultValue={value}></textarea>
-        </Modal.Body>
+        </ModalBody>
       </Modal>
     );
   }

src/client/styles/scss/_override-bootstrap.scss

@@ -101,11 +101,11 @@
 }
 
 .modal-header {
-  border: 1px solid #e5e5e5;
+  border-bottom: 1px solid #e5e5e5;
 }
 
 .modal-footer {
-  border: 1px solid #e5e5e5;
+  border-top: 1px solid #e5e5e5;
 }
 
 // col-form-label (substitute for control-label of bootstrap3)
@@ -124,3 +124,11 @@ label {
 fieldset[disabled] .btn {
   cursor: not-allowed;
 }
+
+// input form (disabled box-shadow added in bootstrap4)
+.form-group .form-control {
+  &:focus,
+  &.focus {
+    box-shadow: none;
+  }
+}