From 092409edc161e47838587224b8e4da039b879cfe Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Mon, 9 Sep 2019 09:51:20 +0000
Subject: [PATCH] [REF] web_editor, website: review UI labels and icons

Part of https://github.com/odoo/odoo/pull/36515
---
 .../static/src/scss/wysiwyg_snippets.scss        | 13 ++++---------
 addons/web_editor/views/snippets.xml             |  6 +++---
 .../static/src/js/editor/snippets.options.js     |  2 +-
 addons/website/views/snippets.xml                | 16 ++++++++--------
 4 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
index 2395a436e51..d20ea1ccf6a 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
@@ -60,6 +60,10 @@ body.editor_enable.editor_has_snippets {
                 background: var(--o-we-snippets-bg-color);
                 color: var(--o-we-snippets-color);
             }
+
+            &:focus, &:active, &:focus:active {
+                outline: none;
+            }
         }
     }
 
@@ -201,8 +205,6 @@ body.editor_enable.editor_has_snippets {
                 font-weight: bold;
                 color: inherit !important;
 
-                @include we-icon-button('\f107');
-
                 > we-button-group {
                     flex: 0 0 auto;
                     display: block;
@@ -236,10 +238,6 @@ body.editor_enable.editor_has_snippets {
                 border-radius: 0;
             }
             we-button {
-                &.we-button-hover-icon:hover {
-                    @include we-icon-button('\f040');
-                }
-
                 &.active {
                     @include we-icon-button('\f00c', $o-we-color-success);
                 }
@@ -274,9 +272,6 @@ body.editor_enable.editor_has_snippets {
             color: var(--o-we-snippets-color);
             cursor: pointer;
 
-            > we-title {
-                @include we-icon-button('\f104');
-            }
             > we-customizeblock-option {
                 max-height: 0;
                 transition-duration: 25ms;
diff --git a/addons/web_editor/views/snippets.xml b/addons/web_editor/views/snippets.xml
index 6bd1a5f1597..8f44a8f05a4 100644
--- a/addons/web_editor/views/snippets.xml
+++ b/addons/web_editor/views/snippets.xml
@@ -3,13 +3,13 @@
 <template id="snippets">
     <div id="snippets_menu">
         <button type="button" class="o_we_add_snippet_btn active">
-            <i class="fa fa-plus"/> Add
+            Blocks
         </button>
-        <t t-set="customize_title">Select an element to customize it</t>
+        <t t-set="customize_title">Click in the page to customize</t>
         <button type="button" class="o_we_customize_snippet_btn"
                 t-att-data-title="customize_title"
                 disabled="disabled">
-            <i class="fa fa-cog"/> Customize
+            Options
         </button>
     </div>
 
diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index d3f2e7e9730..761fae6f816 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -1519,7 +1519,7 @@ options.registry.anchorName = options.Class.extend({
             });
         }
         new Dialog(this, {
-            title: _t("Anchor Name"),
+            title: _t("Link Anchor"),
             $content: $(qweb.render('website.dialog.anchorName', {
                 currentAnchor: this.$target.attr('id'),
             })),
diff --git a/addons/website/views/snippets.xml b/addons/website/views/snippets.xml
index 7dafe86897c..1e4e72dd4f7 100644
--- a/addons/website/views/snippets.xml
+++ b/addons/website/views/snippets.xml
@@ -134,7 +134,7 @@
     </section>
 </template>
 
-<template id="s_three_columns" name="Three Columns">
+<template id="s_three_columns" name="Columns">
     <section class="s_three_columns bg-200 pt32 pb32">
         <div class="container">
             <div class="row d-flex align-items-stretch">
@@ -1157,7 +1157,7 @@
             <i class="fa fa-fw fa-trash-o"/> Remove Slide
         </we-button>
         <we-collapse-area>
-            <we-toggler><i class="fa fa-fw fa-clone"/>Transition</we-toggler>
+            <we-toggler><i class="fa fa-fw fa-clone"/> Transition</we-toggler>
             <we-collapse>
                 <we-button data-select-class="slide">Slide</we-button>
                 <we-button data-select-class="carousel-fade slide">Fade</we-button>
@@ -1198,7 +1198,7 @@
     </div>
 
     <div data-js="gallery" data-selector=".o_gallery">
-        <we-button class="we-button-hover-icon" data-add-images="true" data-no-preview="true">
+        <we-button data-add-images="true" data-no-preview="true">
             <i class="fa fa-fw fa-plus-circle"/> Add images
         </we-button>
         <we-button data-remove-all-images="true" data-no-preview="true">
@@ -1271,7 +1271,7 @@
 
     <!-- Facebook Page -->
     <div data-js="facebookPage" data-selector=".o_facebook_page">
-        <we-button class="we-button-hover-icon" data-fb-page-options="true" data-no-preview="true">
+        <we-button data-fb-page-options="true" data-no-preview="true">
             <i class="fa fa-fw fa-facebook"/> Options
         </we-button>
     </div>
@@ -1315,7 +1315,7 @@
     <div data-js="background"
         data-selector="section, .parallax, :not(.o_gallery > .container) > .carousel"
         data-exclude=".s_hr, .s_image_gallery">
-        <we-button class="we-button-hover-icon" data-choose-image="true" data-no-preview="true">
+        <we-button data-choose-image="true" data-no-preview="true">
             <i class="fa fa-fw fa-picture-o"/> Background Image
         </we-button>
     </div>
@@ -1323,7 +1323,7 @@
     <!-- Background Image -->
     <div data-js="background_position"
         data-selector="section, .parallax, :not(.o_gallery > .container) > .carousel">
-        <we-button class="we-button-hover-icon" data-background-position="true" data-no-preview="true">
+        <we-button data-background-position="true" data-no-preview="true">
             <i class="fa fa-fw fa-arrows"/> Background Image Sizing
         </we-button>
     </div>
@@ -1446,8 +1446,8 @@
     <div data-js="anchorName"
         data-selector=":not(p).oe_structure > *, :not(p)[data-oe-type=html] > *, .row > div"
         data-exclude=".modal *">
-        <we-button class="we-button-hover-icon" data-no-preview="true" data-open-anchor-dialog="">
-            <i class="fa fa-fw fa-anchor"/> Anchor Name
+        <we-button data-no-preview="true" data-open-anchor-dialog="">
+            <i class="fa fa-fw fa-anchor"/> Link Anchor
         </we-button>
     </div>