2 files changed, 36 insertions, 16 deletions
diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index 834baff3e35..33845547c46 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -1,3 +1,4 @@
+@charset "utf-8";
 /* ---- CKEditor Minimal Reset ---- */
 .navbar.navbar-inverse .cke_chrome {
   border: none;
@@ -24,7 +25,7 @@
   width: 100%;
   padding: 2px;
   margin: 0;
-  z-index: 10000;
+  z-index: 20000;
   background-color: #414141;
   background: -webkit-linear-gradient(#646060, #262626);
   box-sizing: border-box;
@@ -118,7 +119,7 @@ table.editorbar-panel td.selected {
   background: #282828;
   box-shadow: 0px 10px 10px -10px black inset;
   overflow-y: auto;
-  z-index: 100;
+  z-index: 20000;
 }
 #oe_snippets .nav-pills {
   padding: 3px 8px;
@@ -217,7 +218,7 @@ table.editorbar-panel td.selected {
 }
 .oe_drop_zone.oe_hover {
   background: rgba(0, 255, 133, 0.22);
-  z-index: 97;
+  z-index: 1001;
 }
 
 /* ---- SNIPPET MANIPULATOR ---- */
@@ -257,23 +258,33 @@ table.editorbar-panel td.selected {
 }
 .oe_overlay .oe_overlay_options {
   display: none;
-  z-index: 99;
+  z-index: 1002;
 }
 .oe_overlay .oe_overlay_options .oe_option {
+  top: 50%;
+  left: 50%;
   pointer-events: auto;
   position: absolute;
+  display: block;
+  z-index: 1002;
 }
 .oe_overlay .oe_overlay_options .oe_option.n {
-  top: 0px;
+  top: -11px;
 }
 .oe_overlay .oe_overlay_options .oe_option.e {
-  right: 0px;
+  left: auto;
+  right: -6px;
 }
 .oe_overlay .oe_overlay_options .oe_option.s {
-  bottom: 0px;
+  top: auto;
+  bottom: -10px;
 }
 .oe_overlay .oe_overlay_options .oe_option.w {
-  left: 0px;
+  left: -6px;
+}
+.oe_overlay .oe_overlay_options .oe_option > a {
+  text-decoration: none;
+  font-size: 1.2em;
 }
 .oe_overlay.oe_active .oe_overlay_options {
   display: block;
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index 3c1fe6a47f5..d3a58c91a13 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -25,7 +25,7 @@
     width: 100%
     padding: 2px
     margin: 0
-    z-index: 10000
+    z-index: 20000
     background-color: #414141
     background: -webkit-linear-gradient(#646060, #262626)
     box-sizing: border-box
@@ -109,7 +109,7 @@ table.editorbar-panel
     background: rgb(40,40,40)
     box-shadow: 0px 10px 10px -10px black inset
     overflow-y: auto
-    z-index: 100
+    z-index: 20000
     .nav-pills
         padding: 3px 8px
         background: #444444
@@ -195,7 +195,7 @@ table.editorbar-panel
     border-radius: 3px
     &.oe_hover
         background: rgba(0, 255, 133, 0.22)
-        z-index: 97
+        z-index: 1001
 
 /* ---- SNIPPET MANIPULATOR ---- */
 
@@ -229,18 +229,27 @@ table.editorbar-panel
 
     .oe_overlay_options
         display: none
-        z-index: 99
+        z-index: 1002
         .oe_option
+            top: 50%
+            left: 50%
             pointer-events: auto
             position: absolute
+            display: block
+            z-index: 1002
             &.n
-                top: 0px
+                top: -11px
             &.e
-                right: 0px
+                left: auto
+                right: -6px
             &.s
-                bottom: 0px
+                top: auto
+                bottom: -10px
             &.w
-                left: 0px
+                left: -6px
+            > a
+                text-decoration: none
+                font-size: 1.2em
     &.oe_active .oe_overlay_options
         display: block