Merge pull request #2021 from weseek/fix/adjust-height-of-modal-body

Fix/adjust height of modal body

src/client/js/components/Admin/Security/LdapAuthTestModal.jsx

@@ -43,8 +43,8 @@ class LdapAuthTestModal extends React.Component {
 
     return (
       <Modal show={this.props.isOpen} onHide={this.props.onClose}>
-        <Modal.Header className="modal-header" closeButton>
-          <Modal.Title>
+        <Modal.Header className="bg-info modal-header" closeButton>
+          <Modal.Title className="text-white">
             Test LDAP Account
           </Modal.Title>
         </Modal.Header>
@@ -56,7 +56,6 @@ class LdapAuthTestModal extends React.Component {
             onChangePassword={this.onChangePassword}
           />
         </Modal.Body>
-        <Modal.Footer />
       </Modal>
     );
   }

src/client/styles/scss/_modal.scss

@@ -0,0 +1,6 @@
+.modal-body {
+  // Adjust the height by subtracting the footer and the footer
+  // show https://stackoverflow.com/questions/24166568/set-bootstrap-modal-body-height-by-percentage/26078942
+  max-height: calc(100% - 120px);
+  overflow-y: auto;
+}

src/client/styles/scss/style-app.scss

@@ -45,6 +45,7 @@
 @import 'tag';
 @import 'staff_credit';
 @import 'draft';
+@import 'modal';
 
 /*
  * for Guest User Mode