fix constructure

src/client/js/components/PageAttachment.jsx

@@ -147,24 +147,24 @@ class PageAttachment extends React.Component {
     }
 
     return (
-      <div>
-        <PageAttachmentList
-          attachments={this.state.attachments}
-          inUse={this.state.inUse}
-          onAttachmentDeleteClicked={this.onAttachmentDeleteClicked}
-          isUserLoggedIn={this.isUserLoggedIn()}
-        />
+      <div className="page-attachment-container-create d-flex flex-column align-items-center">
+        <div className="page-attachment-flat w-100">
+          <PageAttachmentList
+            attachments={this.state.attachments}
+            inUse={this.state.inUse}
+            onAttachmentDeleteClicked={this.onAttachmentDeleteClicked}
+            isUserLoggedIn={this.isUserLoggedIn()}
+          />
+        </div>
 
         {deleteAttachmentModal}
 
-        <div className="my-3 d-flex justify-content-center">
-          <PaginationWrapper
-            activePage={this.state.activePage}
-            changePage={this.handlePage}
-            totalItemsCount={this.state.totalAttachments}
-            pagingLimit={this.state.limit}
-          />
-        </div>
+        <PaginationWrapper
+          activePage={this.state.activePage}
+          changePage={this.handlePage}
+          totalItemsCount={this.state.totalAttachments}
+          pagingLimit={this.state.limit}
+        />
       </div>
     );
   }

src/client/js/components/PageList.jsx

@@ -58,18 +58,16 @@ const PageList = (props) => {
   ));
 
   return (
-    <div className="page-list-container-create">
-      <ul className="page-list-ul page-list-ul-flat mb-3">
+    <div className="page-list-container-create d-flex flex-column align-items-center">
+      <ul className="page-list-ul page-list-ul-flat w-100">
         {pageList}
       </ul>
-      <div className="my-3 d-flex justify-content-center">
-        <PaginationWrapper
-          activePage={activePage}
-          changePage={setPageNumber}
-          totalItemsCount={totalPages}
-          pagingLimit={limit}
-        />
-      </div>
+      <PaginationWrapper
+        activePage={activePage}
+        changePage={setPageNumber}
+        totalItemsCount={totalPages}
+        pagingLimit={limit}
+      />
     </div>
   );
 

src/client/js/components/PageTimeline.jsx

@@ -67,8 +67,9 @@ class PageTimeline extends React.Component {
     }
 
     return (
-      <div>
-        { pages.map((page) => {
+      <div className="timeline-container-create d-flex flex-column align-items-center">
+        <div className="timeline-flat w-100">
+          { pages.map((page) => {
           return (
             <div className="timeline-body" key={`key-${page.id}`}>
               <div className="card card-timeline">
@@ -85,14 +86,13 @@ class PageTimeline extends React.Component {
             </div>
           );
         }) }
-        <div className="my-3 d-flex justify-content-center">
-          <PaginationWrapper
-            activePage={this.state.activePage}
-            changePage={this.handlePage}
-            totalItemsCount={this.state.totalPageItems}
-            pagingLimit={this.state.limit}
-          />
         </div>
+        <PaginationWrapper
+          activePage={this.state.activePage}
+          changePage={this.handlePage}
+          totalItemsCount={this.state.totalPageItems}
+          pagingLimit={this.state.limit}
+        />
       </div>
     );