fix fb

src/client/js/components/Navbar/ThreeStrandedButton.jsx

@@ -11,10 +11,27 @@ const ThreeStrandedButton = (props) => {
     }
   }
 
+  $('#view').on('click', () => {
+    $('body').removeClass('on-edit');
+    $('body').removeClass('builtin-editor');
+    $('body').removeClass('hackmd');
+  });
+
+  $('#edit').on('click', () => {
+    $('body').addClass('on-edit');
+    $('body').addClass('builtin-editor');
+    $('body').removeClass('hackmd');
+  });
+
+  $('#hackmd').on('click', () => {
+    $('body').addClass('on-edit');
+    $('body').addClass('hackmd');
+    $('body').removeClass('builtin-editor');
+  });
+
   return (
     <div className="btn-group grw-three-stranded-button" role="group " aria-label="three-stranded-button">
       <button
-        id="view"
         type="button"
         className="btn btn-outline-primary view-button"
         onClick={() => { threeStrandedButtonClickedHandler('view') }}
@@ -23,7 +40,6 @@ const ThreeStrandedButton = (props) => {
         { t('view') }
       </button>
       <button
-        id="edit"
         type="button"
         className="btn btn-outline-primary edit-button"
         onClick={() => { threeStrandedButtonClickedHandler('edit') }}
@@ -33,7 +49,6 @@ const ThreeStrandedButton = (props) => {
       </button>
 
       <button
-        id="hackmd"
         type="button"
         className="btn btn-outline-primary hackmd-button"
         onClick={() => { threeStrandedButtonClickedHandler('hackmd') }}

src/client/js/components/Page/DisplaySwitcher.jsx

@@ -13,44 +13,25 @@ const DisplaySwitcher = (props) => {
   const { navigationContainer } = props;
   const { editorMode } = navigationContainer.state;
 
-  $('#view').on('click', () => {
-    $('body').removeClass('on-edit');
-    $('body').removeClass('builtin-editor');
-    $('body').removeClass('hackmd');
-  });
-
-  $('#edit').on('click', () => {
-    $('body').addClass('on-edit');
-    $('body').addClass('builtin-editor');
-    $('body').removeClass('hackmd');
-  });
-
-  $('#hackmd').on('click', () => {
-    $('body').addClass('on-edit');
-    $('body').addClass('hackmd');
-    $('body').removeClass('builtin-editor');
-
-
-  });
-
   return (
-    <TabContent activeTab={editorMode}>
-      <TabPane tabId="view">
-        <Page />
-      </TabPane>
-      <TabPane tabId="edit">
-        <div id="page-editor" className="page-editor-preview-container page-editor-preview-body">
-          <Editor />
-          <EditorNavbarBottom />
-        </div>
-      </TabPane>
-      <TabPane tabId="hackmd">
-        <div id="page-editor-with-hackmd" className="hackmd-preinit hackmd-error">
-          <PageEditorByHackmd />
-          <EditorNavbarBottom />
-        </div>
-      </TabPane>
-    </TabContent>
+    <>
+      <TabContent activeTab={editorMode}>
+        <TabPane tabId="view">
+          <Page />
+        </TabPane>
+        <TabPane tabId="edit">
+          <div id="page-editor" className="page-editor-preview-container page-editor-preview-body">
+            <Editor />
+          </div>
+        </TabPane>
+        <TabPane tabId="hackmd">
+          <div className="hackmd-preinit hackmd-error">
+            <PageEditorByHackmd />
+          </div>
+        </TabPane>
+      </TabContent>
+      {/* <EditorNavbarBottom /> */}
+    </>
   );
 };
 

src/server/views/widget/page_content.html

@@ -1,5 +1,5 @@
 {% if page %}
-<div id="content-main" class="content-main container col"
+<div id="content-main" class="content-main container"
   data-path="{{ encodeURI(page.path) }}"
   data-current-user="{% if user %}{{ user._id.toString() }}{% endif %}"
   data-page-id="{% if page %}{{ page._id.toString() }}{% endif %}"
@@ -40,7 +40,7 @@
 {% endif %}
 
   {% include 'page_alerts.html' %}
-  <div class="tab-content" id="display-switcher">
+  <div id="display-switcher">
     <script type="text/template" id="raw-text-original">{{ revision.body.toString() | encodeHTML }}</script>
     {% include '../_form.html' %}
   </div>