From 98c8438f5225dbc34b15fc2ed5b9918d537bb71b Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Wed, 18 Mar 2020 11:40:42 +0000
Subject: [PATCH] [FIX] website: restore top menu transparent color option
 behavior

The option was not adapted correctly to the new left panel option
system, especially: not adapted to the use of a dedicated colorpicker
widget.

Part of https://github.com/odoo/odoo/pull/45093
task-2151408

X-original-commit: 39ed330ba635af7c81f03df2fdfe4309c95e05d9
---
 .../static/src/js/editor/snippets.options.js  | 34 +++++++++----------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index 5ab0769e47b..8a6f89ee06f 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -1450,6 +1450,22 @@ options.registry.topMenuTransparency = options.Class.extend({
 
 options.registry.topMenuColor = options.Class.extend({
 
+    //--------------------------------------------------------------------------
+    // Options
+    //--------------------------------------------------------------------------
+
+    /**
+     * @override
+     */
+    selectStyle(previewMode, widgetValue, params) {
+        this._super(...arguments);
+        const className = widgetValue ? (params.colorPrefix + widgetValue) : '';
+        this.trigger_up('action_demand', {
+            actionName: 'toggle_page_option',
+            params: [{name: 'header_color', value: className}],
+        });
+    },
+
     //--------------------------------------------------------------------------
     // Private
     //--------------------------------------------------------------------------
@@ -1470,24 +1486,6 @@ options.registry.topMenuColor = options.Class.extend({
             });
         });
     },
-
-    //--------------------------------------------------------------------------
-    // Handlers
-    //--------------------------------------------------------------------------
-
-    /**
-     * @override
-     */
-    _onColorButtonClick: function () {
-        this._super.apply(this, arguments);
-        var bgs = this.$target.attr('class').match(/bg-(\w|-)+/g);
-        var allowedBgs = this.classes.split(' ');
-        var color = _.intersection(bgs, allowedBgs).join(' ');
-        this.trigger_up('action_demand', {
-            actionName: 'toggle_page_option',
-            params: [{name: 'header_color', value: color}],
-        });
-    },
 });
 
 /**