adjust size

src/client/js/components/PageEditor/HandsontableModal.jsx

@@ -416,8 +416,8 @@ export default class HandsontableModal extends React.PureComponent {
     const dialogClassName = dialogClassNames.join(' ');
 
     return (
-      <Modal isOpen={this.state.show} toggle={this.cancel} bsSize="large" dialogClassName={dialogClassName} className="grw-handsontable-modal">
-        <ModalHeader toggle={this.cancel} className="grw-modal-header">
+      <Modal isOpen={this.state.show} toggle={this.cancel} size="lg" className={dialogClassName}>
+        <ModalHeader toggle={this.cancel}>
           <span>Edit Table</span>
           <span className="ml-auto">{ this.renderExpandOrContractButton() }</span>
         </ModalHeader>

src/client/styles/scss/_handsontable.scss

@@ -12,6 +12,7 @@
 .handsontable-modal.handsontable-modal-expanded {
   // full-screen modal
   width: 97%;
+  max-width: unset;
   height: 95%;
   .modal-content {
     height: 95%;

src/client/styles/scss/_modal.scss

@@ -1,15 +0,0 @@
-.grw-handsontable-modal {
-  width: 900px;
-  max-width: initial;
-  overflow-x: hidden;
-  .grw-modal-header {
-    .modal-title {
-      display: flex;
-      width: 100%;
-    }
-  }
-  .grw-modal-footer {
-    display: flex;
-    border-top: 1px solid $border;
-  }
-}

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

@@ -39,7 +39,6 @@
 @import 'layout_kibela';
 @import 'layout_variable';
 @import 'login';
-@import 'modal';
 @import 'navbar';
 @import 'navbar_kibela';
 @import 'notification';