From b61450969876b0ece06e3412d8f0573b69173b7f Mon Sep 17 00:00:00 2001
From: Romain Estievenart <res@odoo.com>
Date: Mon, 17 May 2021 11:39:19 +0000
Subject: [PATCH] [FIX] pos: "Discard" button at the wrong place.
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

"Discard" button shoud be on the left to respect the intuitive
mobile navigation.

We also take advantage of this commit to show icons and text on
desktop and only show the icons on mobile.

Task ID: 2453679

X-original-commit: f774f07a46197f7e1664aee32723b10bf6df37b4
Part-of: odoo/odoo#79448
Co-authored-by: Adrien Dieudonné <adr@odoo.com>
---
 addons/point_of_sale/static/src/css/pos.css   |  6 ----
 .../ClientListScreen/ClientListScreen.xml     | 31 +++++++------------
 2 files changed, 11 insertions(+), 26 deletions(-)

diff --git a/addons/point_of_sale/static/src/css/pos.css b/addons/point_of_sale/static/src/css/pos.css
index 05996e4fff4..bfcf4799d14 100644
--- a/addons/point_of_sale/static/src/css/pos.css
+++ b/addons/point_of_sale/static/src/css/pos.css
@@ -1848,7 +1848,6 @@ td {
 }
 .pos .clientlist-screen .client-details{
     padding: 16px;
-    border-bottom: solid 5px rgb(110,200,155);
 }
 .pos .clientlist-screen .client-picture{
     height: 64px;
@@ -1946,11 +1945,6 @@ td {
 .pos .clientlist-screen .client-detail > .empty{
     opacity: 0.3;
 }
-
-.pos .clientlist-screen .button.new-customer {
-    min-width: 30px;
-}
-
 .pos .searchbox-client {
     padding: 3px 13px;
     margin-top: 12px;
diff --git a/addons/point_of_sale/static/src/xml/Screens/ClientListScreen/ClientListScreen.xml b/addons/point_of_sale/static/src/xml/Screens/ClientListScreen/ClientListScreen.xml
index 597bdf75ff9..af0f68947b4 100644
--- a/addons/point_of_sale/static/src/xml/Screens/ClientListScreen/ClientListScreen.xml
+++ b/addons/point_of_sale/static/src/xml/Screens/ClientListScreen/ClientListScreen.xml
@@ -5,15 +5,15 @@
         <div class="clientlist-screen screen" t-on-activate-edit-mode="activateEditMode">
             <div class="screen-content">
                 <div class="top-content">
+                    <div class="button back" t-on-click="back">
+                        <i class="fa fa-angle-double-left"/>
+                        <t t-if="!env.isMobile"> Discard</t>
+                    </div>
                     <div t-if="!state.detailIsShown &amp;&amp; !state.selectedClient" class="button new-customer" role="img" aria-label="Add a customer"
-                          t-on-click="trigger('activate-edit-mode', { isNewClient: true })"
-                          title="Add a customer">
-                        <t t-if="!env.isMobile">
-                            Create
-                        </t>
-                        <t t-else="">
-                            <i class="fa fa-plus"></i>
-                        </t>
+                            t-on-click="trigger('activate-edit-mode', { isNewClient: true })"
+                            title="Add a customer">
+                        <i class="fa fa-plus"/>
+                        <t t-if="!env.isMobile"> Create</t>
                     </div>
                     <div t-if="isNextButtonVisible" t-on-click="clickNext"
                           class="button next highlight">
@@ -21,24 +21,15 @@
                             <t t-esc="nextButton.text" />
                         </t>
                         <t t-else="">
-                            <i t-if="nextButton.command === 'deselect'" class="fa fa-trash"></i>
-                            <i t-if="nextButton.command === 'set'" class="fa fa-check"></i>
+                            <i t-if="nextButton.command === 'deselect'" class="fa fa-trash"/>
+                            <i t-elif="nextButton.command === 'set'" class="fa fa-check"/>
                         </t>
                     </div>
                     <div class="button" t-if="state.detailIsShown" t-on-click="trigger('click-save')">
+                        <i class="fa fa-floppy-o"/>
                         <t t-if="!env.isMobile">
-                            <i class="fa fa-floppy-o"/>
                             <span> Save</span>
                         </t>
-                        <t t-else="">
-                            <i class="fa fa-floppy-o"/>
-                        </t>
-                    </div>
-                    <div class="button back" t-on-click="back">
-                        <t t-if="!env.isMobile">Discard</t>
-                        <t t-else="">
-                            <i class="fa fa-undo"></i>
-                        </t>
                     </div>
                     <div t-if="!state.detailIsShown" class="searchbox-client top-content-center">
                         <input placeholder="Search Customers" size="1" t-on-keyup="updateClientList" />