Mare the rte toolbar hidden on render. Closes #461

GrapesJS · Oct 30, 2017 · 45804f3 · 45804f3
1 parent 9c2da6c
commit 45804f3
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/src/canvas/view/CanvasView.js b/src/canvas/view/CanvasView.js
@@ -121,13 +121,13 @@ module.exports = Backbone.View.extend({
       var frameCss = `
         ${baseCss}
 
-        .${ppfx}dashed :not([contenteditable]) > *[data-highlightable] {
+        .${ppfx}dashed *[data-highlightable] {
           outline: 1px dashed rgba(170,170,170,0.7);
           outline-offset: -2px
         }
 
         .${ppfx}comp-selected {
-          outline: 3px solid #3b97e3 !important
+          outline: 3px solid #3b97e3 !important;
         }
 
         .${ppfx}comp-selected-parent {

diff --git a/src/rich_text_editor/index.js b/src/rich_text_editor/index.js
@@ -21,6 +21,14 @@ module.exports = () => {
   const defaults = require('./config/config');
   let toolbar, actions, lastEl, globalRte;
 
+  const hideToolbar = () => {
+    const style = toolbar.style;
+    const size = '-100px';
+    style.top = size;
+    style.left = size;
+    style.display = 'none';
+  };
+
   return {
 
     customRte: null,
@@ -72,6 +80,7 @@ module.exports = () => {
     postRender(ev) {
       const canvas = ev.model.get('Canvas');
       toolbar.style.pointerEvents = 'all';
+      hideToolbar();
       canvas.getToolsEl().appendChild(toolbar);
     },
 
@@ -266,7 +275,6 @@ module.exports = () => {
     disable(view, rte) {
       const em = config.em;
       const customRte = this.customRte;
-      const style = toolbar.style;
       var el = view.getChildrenContainer();
 
       if (customRte) {
@@ -275,9 +283,7 @@ module.exports = () => {
         rte.disable();
       }
 
-      style.display = 'none';
-      style.top = 0;
-      style.left = 0;
+      hideToolbar();
       em && em.trigger('rte:disable', view, rte);
     },
   };