Merge branch 'feat/transplant-tabs-to-modal-for-master-merge' into feat/gw3890-modal-header-refactoring

# Conflicts:
#	src/client/js/components/PageAccessoriesModal.jsx

src/client/js/components/PageAccessoriesModal.jsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 
 import {
-  Button, Modal, ModalBody, ModalHeader, Nav, NavItem, NavLink, TabContent, TabPane,
+  Modal, ModalBody, ModalHeader, Nav, NavItem, NavLink, TabContent, TabPane,
 } from 'reactstrap';
 
 import { withTranslation } from 'react-i18next';
@@ -119,12 +119,11 @@ const PageAccessoriesModal = (props) => {
           <hr className="my-0 grw-nav-slide-hr border-none" style={{ width: `${sliderWidth}%`, marginLeft: `${sliderMarginLeft}%` }} />
         </ModalHeader>
         <ModalBody className="overflow-auto grw-modal-body-style p-0">
-          {/* <hr className="modal-split-hr m-0" /> */}
-          <TabContent activeTab={activeTab}>
+          <TabContent activeTab={activeTab} className="p-5">
             <TabPane tabId="pagelist">
               {pageAccessoriesContainer.state.activeComponents.has('pagelist') && <PageList />}
             </TabPane>
-            <TabPane tabId="timeline" className="p-4">
+            <TabPane tabId="timeline">
               {pageAccessoriesContainer.state.activeComponents.has('timeline') && <PageTimeline /> }
             </TabPane>
             <TabPane tabId="pageHistory">
@@ -132,10 +131,10 @@ const PageAccessoriesModal = (props) => {
                 {pageAccessoriesContainer.state.activeComponents.has('pageHistory') && <PageHistory /> }
               </div>
             </TabPane>
-            <TabPane tabId="attachment" className="p-4">
+            <TabPane tabId="attachment">
               {pageAccessoriesContainer.state.activeComponents.has('attachment') && <PageAttachment />}
             </TabPane>
-            <TabPane tabId="shareLink" className="p-4">
+            <TabPane tabId="shareLink">
               {pageAccessoriesContainer.state.activeComponents.has('shareLink') && <ShareLink />}
             </TabPane>
           </TabContent>

src/client/js/components/PageHistory.jsx

@@ -65,7 +65,7 @@ function PageHistory(props) {
 
 
   return (
-    <div className="mt-4">
+    <div>
       <PageRevisionList
         revisions={pageHistoryContainer.state.revisions}
         diffOpened={pageHistoryContainer.state.diffOpened}

src/client/js/components/PageList.jsx

@@ -52,14 +52,14 @@ const PageList = (props) => {
   }
 
   const pageList = pages.map(page => (
-    <li key={page._id}>
+    <li key={page._id} className="mb-3">
       <Page page={page} />
     </li>
   ));
 
   return (
     <div className="page-list-container-create">
-      <ul className="page-list-ul page-list-ul-flat ">
+      <ul className="page-list-ul page-list-ul-flat ml-n4">
         {pageList}
       </ul>
       <PaginationWrapper

src/client/js/components/ShareLink/ShareLink.jsx

@@ -85,7 +85,7 @@ class ShareLink extends React.Component {
     const { t } = this.props;
 
     return (
-      <div className="container">
+      <div className="container p-0">
         <h3 className="grw-modal-head d-flex pb-2">
           { t('share_links.share_link_list') }
           <button className="btn btn-danger ml-auto " type="button" onClick={this.deleteAllLinksButtonHandler}>{t('delete_all')}</button>
@@ -97,7 +97,7 @@ class ShareLink extends React.Component {
             onClickDeleteButton={this.deleteLinkById}
           />
           <button
-            className="btn btn-outline-secondary d-block mx-auto px-5 mb-3"
+            className="btn btn-outline-secondary d-block mx-auto px-5"
             type="button"
             onClick={this.toggleShareLinkFormHandler}
           >

src/client/styles/scss/_page_accessaries_modal.scss

@@ -28,6 +28,9 @@
   .grw-modal-body-style {
     max-height: calc(100vh - 100px);
   }
+  ul.pagination {
+    margin-bottom: 0rem;
+  }
 }
 
 // revision-history