From e0b8e5e0e793fc5c96ff875c504f483a0c6a018c Mon Sep 17 00:00:00 2001
From: Shreya Thakrar <sht@odoo.com>
Date: Wed, 7 Aug 2019 09:23:28 +0000
Subject: [PATCH] [FIX] website_rating: fix review display in mobile

In mobile view, review display layout is not clean. Stars string is too short
and progressbar is also too short. This is because we have visibility hidden
for 'Remove Selection', visibility property takes space.

In this commit we give more space for stars / text, and in mobile we add an
icon instead of 'Remove Selection' string.

Task 2047409

closes odoo/odoo#35598

Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
---
 addons/website_rating/static/src/scss/website_rating.scss | 2 +-
 addons/website_rating/static/src/xml/website_mail.xml     | 5 ++++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/addons/website_rating/static/src/scss/website_rating.scss b/addons/website_rating/static/src/scss/website_rating.scss
index 69a57691b5b..38fa3b86c6b 100644
--- a/addons/website_rating/static/src/scss/website_rating.scss
+++ b/addons/website_rating/static/src/scss/website_rating.scss
@@ -16,7 +16,7 @@ $o-w-rating-star-color: #FACC2E;
         overflow: visible;
 
         .o_website_rating_table_star_num{
-            min-width: 30px;
+            min-width: 50px;
         }
         .o_website_rating_select[style*="opacity: 1"] {
             cursor: pointer;
diff --git a/addons/website_rating/static/src/xml/website_mail.xml b/addons/website_rating/static/src/xml/website_mail.xml
index fc1c00cb7a9..8d666024981 100644
--- a/addons/website_rating/static/src/xml/website_mail.xml
+++ b/addons/website_rating/static/src/xml/website_mail.xml
@@ -49,7 +49,10 @@
                                     <strong><t t-esc="Math.round(percent['percent'] * 100) / 100"/>%</strong>
                                 </td>
                                 <td class="o_website_rating_table_reset">
-                                    <a href="#" role="button" class="btn btn-link o_website_rating_select_text" t-att-data-star="percent['num']">Remove selection</a>
+                                    <a href="#" role="button" class="btn btn-link o_website_rating_select_text" t-att-data-star="percent['num']">
+                                        <i class="fa fa-times d-block d-sm-none" role="img" aria-label="Remove Selection"></i>
+                                        <span class="d-none d-sm-block">Remove Selection</span>
+                                    </a>
                                 </td>
                             </tr>
                         </t>