[MERGE] forward port of branch saas-10 up to 1e86774

2 files changed, 50 insertions, 22 deletions

diff --git a/addons/web_editor/static/src/less/web_editor.backend.less b/addons/web_editor/static/src/less/web_editor.backend.less
index 0ff97e327aa..53789aae8af 100644
--- a/addons/web_editor/static/src/less/web_editor.backend.less
+++ b/addons/web_editor/static/src/less/web_editor.backend.less
@@ -83,3 +83,21 @@
         box-shadow: #DDCC33 0 0 5px 2px inset;
     }
 }
+
+// FIX (to improve in next versions)
+// ---------------------------------
+// The web_editor.colorpicker defines a series of color buttons which toggle the bg-* and text-* classes.
+// The problem is that themes can define new buttons whose bg-* and text-* classes only exist in the frontend.
+// So these buttons should not be displayed in the backend. Only solution for the current implementation is
+// to add this ugly rule (in this backend file) which hides every button and redisplayed the default ones.
+.note-editor {
+    .colorpicker .o_colorpicker_section > button {
+        display: none;
+
+        &[data-color="alpha"], &[data-color="beta"], &[data-color="gamma"], &[data-color="delta"], &[data-color="epsilon"],
+        &[data-color="white"], &[data-color="gray-lighter"], &[data-color="gray-light"], &[data-color="gray"], &[data-color="gray-dark"], &[data-color="gray-darker"], &[data-color="black"],
+        &[data-color="primary"], &[data-color="success"], &[data-color="info"], &[data-color="warning"], &[data-color="danger"] {
+            display: block;
+        }
+    }
+}
diff --git a/addons/web_editor/static/src/less/web_editor.ui.less b/addons/web_editor/static/src/less/web_editor.ui.less
index 33edd55dc61..df96dac896d 100644
--- a/addons/web_editor/static/src/less/web_editor.ui.less
+++ b/addons/web_editor/static/src/less/web_editor.ui.less
@@ -643,8 +643,10 @@
     width: auto;
     text-align: center;
     box-shadow: none;
+    
     .popover-content {
         height: @odoo-navbar-height;
+
         .btn {
             height: @odoo-navbar-height;
             border: none;
@@ -684,13 +686,6 @@
                     background-color: @o-we-tab-active-bg;
                     color: white;
                 }
-
-                > i {
-                    visibility: hidden;
-                }
-                &.checked > i {
-                    visibility: visible;
-                }
             }
         }
         #colors_preview {
@@ -707,26 +702,41 @@
 
         // COLORPICKER
         .note-color {
-            .dropdown-toggle {
-                width: auto;
-            }
-            .o_foreground_toggle > button:before {
-                font-family: FontAwesome;
-                content: '\f1fc';
-            }
-            .o_background_toggle > button:before {
-                font-family: FontAwesome;
-                content: '\f0c3';
-            }
-
             border: 1px solid @o-we-color-divider;
             border-width: 0 1px;
-            .dropdown-menu {
-                min-width: 250px!important;
-                padding: 0!important;
+        }
+    }
+}
+
+.note-popover .popover, .note-editor {
+    .dropdown-menu {
+        > li > a {
+            > i {
+                visibility: hidden;
+            }
+            &.checked > i {
+                visibility: visible;
             }
         }
     }
+
+    .note-color {
+        .dropdown-toggle {
+            width: auto;
+        }
+        .o_foreground_toggle > button:before {
+            font-family: FontAwesome;
+            content: '\f1fc';
+        }
+        .o_background_toggle > button:before {
+            font-family: FontAwesome;
+            content: '\f0c3';
+        }
+        .dropdown-menu {
+            min-width: 250px!important;
+            padding: 0!important;
+        }
+    }
 }
 
 table.colorpicker {