#628: Page Builder Wysiwyg Editor Element blocks view to content area - Move toolbar to top

Author: hannahnida

app/code/Magento/PageBuilder/view/adminhtml/web/css/source/_inline-wysiwyg.less

@@ -72,10 +72,10 @@
     }
 }
 
-.mce-tinymce-inline.mce-arrow.mce-container.mce-floatpanel:not(.mce-arrow-up) {
-    transform: translateY(30px); // table toolbar position fix
-}
+.mce-tinymce-inline.mce-arrow.mce-container.mce-floatpanel[aria-label="Inline toolbar"] {
+    transition: transform 200ms;
 
-.mce-tinymce-inline.mce-arrow.mce-container.mce-floatpanel.mce-arrow-up {
-    transform: translateY(0) !important;
+    &:not(.mce-arrow-up):not(.mce-arrow-down) {
+        transform: translate(-1px, -36px); // table toolbar position fix
+    }
 }

app/code/Magento/PageBuilder/view/adminhtml/web/js/wysiwyg/tinymce4.js

@@ -168,7 +168,6 @@ export default class Wysiwyg implements WysiwygInterface {
                 .css("min-width", this.config.adapter_config.minToolbarWidth + "px");
 
             this.invertInlineEditorToAccommodateOffscreenToolbar();
-            this.setStyleOnTableToolbar();
         });
     }
 
@@ -178,9 +177,6 @@ export default class Wysiwyg implements WysiwygInterface {
     private onChangeContent() {
         this.saveContentDebounce();
         this.invertInlineEditorToAccommodateOffscreenToolbar();
-        _.defer(() => {
-            this.setStyleOnTableToolbar();
-        });
     }
 
     /**
@@ -246,21 +242,4 @@ export default class Wysiwyg implements WysiwygInterface {
     private getFixedToolbarContainer() {
         return $(`#${this.elementId}`).closest(`${this.config.adapter.settings.fixed_toolbar_container}`);
     }
-
-    /**
-     * Adjust table toolbar position, when editor container is smaller than toolbar
-     */
-    private setStyleOnTableToolbar() {
-        if (this.config.adapter_config.mode !== "inline") {
-            return;
-        }
-
-        const $tableToolbar = $(".mce-tinymce-inline.mce-arrow.mce-floatpanel:not(.mce-arrow-up)");
-
-        if (!$tableToolbar.length) {
-            return;
-        }
-
-        $tableToolbar.css("transform", "translateY(" + this.getFixedToolbarContainer().height() + "px)");
-    }
 }