From d9c4d928f7c7e148d024cb56f53e6bfb98389f6d Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Thu, 28 May 2020 10:04:43 +0000
Subject: [IMP] web_editor, *: integrate new o_cc${xxx} classes in the
 colorpicker

*: website

Part of https://github.com/odoo/odoo/pull/45856
task-2197038
---
 addons/web_editor/static/src/xml/snippets.xml | 30 ++++++++++++++++++++++++---
 1 file changed, 27 insertions(+), 3 deletions(-)

(limited to 'addons/web_editor/static/src/xml/snippets.xml')

diff --git a/addons/web_editor/static/src/xml/snippets.xml b/addons/web_editor/static/src/xml/snippets.xml
index 59d3d28d5cc..aee5de39106 100644
--- a/addons/web_editor/static/src/xml/snippets.xml
+++ b/addons/web_editor/static/src/xml/snippets.xml
@@ -43,11 +43,35 @@
 
     <!-- options -->
     <div t-name="web_editor.snippet.option.colorpicker" class="colorpicker">
-
-        <div class="o_colorpicker_sections">
-            <div class="tab-content o_colorpicker_section_tabs"/>
+        <div class="d-flex px-1">
+            <button t-if="widget.withCombinations" type="button" class="btn flex-grow-1 o_we_colorpicker_switch_pane_btn active" data-target="color-combinations">Combinations</button>
+            <button type="button" t-attf-class="btn flex-grow-1 o_we_colorpicker_switch_pane_btn #{widget.withCombinations ? '' : 'active'}" data-target="theme-colors">Custom</button>
+            <button t-if="widget.resetButton" type="button" class="btn flex-grow-1 o_we_color_btn o_colorpicker_reset">
+                <t t-if="widget.withCombinations">None</t>
+                <t t-else="">Reset</t>
+            </button>
+        </div>
+        <div t-attf-class="o_colorpicker_sections #{widget.withCombinations ? '' : 'd-none'} px-1" data-color-tab="color-combinations">
+            <!-- List all Presets -->
+            <t t-foreach="5" t-as="i">
+                <t t-call="web_editor.colorpalette.combination.btn">
+                    <t t-set="number" t-value="i + 1"/>
+                </t>
+            </t>
         </div>
+        <div t-attf-class="o_colorpicker_sections #{widget.withCombinations ? 'd-none' : ''} p-1" data-color-tab="theme-colors"/>
     </div>
+    <t t-name="web_editor.colorpalette.combination.btn">
+        <button type="button" class="o_we_color_btn o_we_color_combination_btn o_we_cc_preview_container"
+                t-att-data-color="number" t-attf-title="Preset #{number}">
+            <div class="o_we_cc_preview_wrapper d-flex justify-content-between align-items-end">
+                <h1 class="o_we_color_combination_btn_title">Title</h1>
+                <p class="o_we_color_combination_btn_text flex-grow-1">Text</p>
+                <span class="o_we_color_combination_btn_btn btn btn-sm btn-primary o_btn_preview mr-1"><small>Button</small></span>
+                <span class="o_we_color_combination_btn_btn btn btn-sm btn-secondary o_btn_preview"><small>Button</small></span>
+            </div>
+        </button>
+    </t>
 
     <t t-name="web_editor.many2one.button">
         <div class="btn-group">
-- 
cgit v1.2.3