Improve position of WYSIWYG editor toolbar

gui/app/components/section/wysiwyg/type-editor.js

@@ -23,6 +23,10 @@ export default Component.extend({
 		let page = this.get('page');
 		return `wysiwyg-editor-${page.id}`;
 	}),
+	toolbarId: computed('page', function () {
+		let page = this.get('page');
+		return `wysiwyg-editor-toolbar-${page.id}`;
+	}),
 
 	didReceiveAttrs() {
 		this._super(...arguments);
@@ -41,7 +45,7 @@ export default Component.extend({
 				gecko_spellcheck: false,
 				statusbar: false,
 				inline: true,
-				// fixed_toolbar_container: '#mytoolbar',
+				// fixed_toolbar_container: '#' + this.get('toolbarId'),
 				paste_data_images: true,
 				image_advtab: true,
 				image_caption: true,

gui/app/templates/components/section/base-editor-inline.hbs

@@ -1,5 +1,4 @@
 <div id="section-editor-{{pageId}}">
-
     <div class="row">
 		<div class="col-8 section-editor">
             {{#if blockMode}}
@@ -15,7 +14,6 @@
                 </div>
             {{/if}}
         </div>
-
 		<div class="col-4">
 			<div class="float-right">
 				{{#if busy}}
@@ -35,15 +33,13 @@
 			</div>
         </div>
     </div>
-
 	<div class="row">
         <div class="col section-editor">
-            <div class="canvas rounded">
+            <div class="canvas rounded mt-5">
                 {{yield}}
             </div>
         </div>
 	</div>
-
 </div>
 
 <div id={{concat "discard-modal-" page.id}} class="modal" tabindex="-1" role="dialog">

gui/app/templates/components/section/wysiwyg/type-editor.hbs

@@ -1,6 +1,7 @@
 {{#section/base-editor-inline document=document folder=folder page=page
 	blockMode=blockMode contentLinkerButton=true onInsertLink=(action 'onInsertLink')
 	isDirty=(action 'isDirty') onCancel=(action 'onCancel') onAction=(action 'onAction')}}
+	<div id={{toolbarId}}></div>
 	<div id={{editorId}} class="mousetrap wysiwyg wysiwyg-editor">
 		{{{pageBody}}}
 	</div>