From 710406e9354c35f7d4f3b57217dbc09a39754cab Mon Sep 17 00:00:00 2001
From: Kaushalya Mandaliya <kma@odoo.com>
Date: Wed, 11 Sep 2019 13:29:54 +0000
Subject: [PATCH] [IMP] website: UX improvements in Optimize SEO Dialog
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Added cursor pointer when hovering a keyword in Related Keywords and
added relevant tooltip for the better user experience.

Renamed classes:
js_seo_keyword_suggestion -> o_seo_keyword_suggestion
js_seo_suggestion -> o_seo_suggestion

task-2070946
closes odoo/odoo#36709

Signed-off-by: Jérémy Kersten (jke) <jke@openerp.com>
---
 addons/website/static/src/js/menu/seo.js       | 6 +++---
 addons/website/static/src/scss/website.ui.scss | 4 ++++
 addons/website/static/src/xml/website.seo.xml  | 4 ++--
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/addons/website/static/src/js/menu/seo.js b/addons/website/static/src/js/menu/seo.js
index 2ac6d7fcded..60bc2318955 100644
--- a/addons/website/static/src/js/menu/seo.js
+++ b/addons/website/static/src/js/menu/seo.js
@@ -20,7 +20,7 @@ var Suggestion = Widget.extend({
     template: 'website.seo_suggestion',
     xmlDependencies: ['/website/static/src/xml/website.seo.xml'],
     events: {
-        'click .js_seo_suggestion': 'select',
+        'click .o_seo_suggestion': 'select',
     },
 
     init: function (parent, options) {
@@ -106,7 +106,7 @@ var Keyword = Widget.extend({
     },
     start: function () {
         var self = this;
-        this.$('.js_seo_keyword_suggestion').empty();
+        this.$('.o_seo_keyword_suggestion').empty();
         this.suggestionList = new SuggestionList(this, {
             root: this.keyword,
             language: this.language,
@@ -115,7 +115,7 @@ var Keyword = Widget.extend({
         this.suggestionList.on('selected', this, function (word, language) {
             this.trigger('selected', word, language);
         });
-        return this.suggestionList.appendTo(this.$('.js_seo_keyword_suggestion')).then(function() {
+        return this.suggestionList.appendTo(this.$('.o_seo_keyword_suggestion')).then(function() {
             self.htmlPage.on('title-changed', self, self._updateTitle);
             self.htmlPage.on('description-changed', self, self._updateDescription);
             self._updateTitle();
diff --git a/addons/website/static/src/scss/website.ui.scss b/addons/website/static/src/scss/website.ui.scss
index 0acd4c36cd0..e2f4cf7f3b6 100644
--- a/addons/website/static/src/scss/website.ui.scss
+++ b/addons/website/static/src/scss/website.ui.scss
@@ -284,6 +284,10 @@ body .modal {
                 }
             }
         }
+
+        td.o_seo_keyword_suggestion span.o_seo_suggestion.badge {
+            cursor: pointer;
+        }
     }
 }
 
diff --git a/addons/website/static/src/xml/website.seo.xml b/addons/website/static/src/xml/website.seo.xml
index 6bafe769f16..de1fc86fa23 100644
--- a/addons/website/static/src/xml/website.seo.xml
+++ b/addons/website/static/src/xml/website.seo.xml
@@ -32,14 +32,14 @@
             <td class="text-center"><i class="js_seo_keyword_title fa fa-check" style="visibility: hidden;" t-attf-title="{{ widget.keyword }} is used in page title"/></td>
             <td class="text-center"><i class="js_seo_keyword_description fa fa-check" style="visibility: hidden;" t-attf-title="{{ widget.keyword }} is used in page description"/></td>
             <td class="text-center"><i t-if="widget.used_content" class="fa fa-check" t-attf-title="{{ widget.keyword }} is used in page content"/></td>
-            <td class="js_seo_keyword_suggestion"/>
+            <td class="o_seo_keyword_suggestion"/>
             <td class="text-center"><a href="#" class="oe_remove" data-action="remove-keyword" t-attf-title="Remove {{ widget.keyword }}"><i class="fa fa-trash"/></a></td>
         </tr>
     </t>
 
     <t t-name="website.seo_suggestion">
         <li class="list-inline-item">
-            <span class="js_seo_suggestion badge badge-info" t-att-data-keyword="widget.keyword" t-esc="widget.keyword"/>
+            <span class="o_seo_suggestion badge badge-info" t-att-data-keyword="widget.keyword" t-attf-title="Add {{ widget.keyword }}" t-esc="widget.keyword"/>
         </li>
     </t>