From dcd60f8de2a7f9050abd680897f9cc589c739ee4 Mon Sep 17 00:00:00 2001
From: Younn Olivier <yol@odoo.com>
Date: Mon, 29 Mar 2021 15:08:01 +0000
Subject: [PATCH] [FIX] website_sale, *: make the product image container not
 editable

*: web_editor

It prevents user writing in the image preview of products.
Also, the product image view now fit its container so that the user can
click wherever in the frame to change the picture.

Part of https://github.com/odoo/odoo/pull/68823
task-2446852

closes odoo/odoo#68850

X-original-commit: e4f06666307e79b9a5b26357a1545a56e6bd40b2
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
---
 addons/web_editor/static/src/js/wysiwyg/wysiwyg.js   |  4 ++++
 .../website_sale/static/src/scss/website_sale.scss   | 12 +++++++++++-
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
index bfa6e7edb54..f543c6cc62f 100644
--- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
+++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
@@ -92,6 +92,10 @@ const Wysiwyg = Widget.extend({
                     $field.attr('contenteditable', false);
                     $field.find('.oe_currency_value').attr('contenteditable', true);
                 }
+                if ($field.data('oe-type') === "image") {
+                    $field.attr('contenteditable', false);
+                    $field.find('img').attr('contenteditable', true);
+                }
                 if ($field.is('[data-oe-many2one-id]')) {
                     $field.attr('contenteditable', false);
                 }
diff --git a/addons/website_sale/static/src/scss/website_sale.scss b/addons/website_sale/static/src/scss/website_sale.scss
index 3ff25d863a6..3e038175af7 100644
--- a/addons/website_sale/static/src/scss/website_sale.scss
+++ b/addons/website_sale/static/src/scss/website_sale.scss
@@ -188,7 +188,9 @@ $o-wsale-products-layout-grid-gutter-width: min($grid-gutter-width / 2, $o-wsale
         text-align: center;
 
         img {
-            max-height: 100%;
+            height: 100%;
+            width: 100%;
+            object-fit: scale-down;
         }
     }
     .o_wsale_product_information {
@@ -572,6 +574,14 @@ a.no-decoration {
     .carousel-outer {
         height: 400px;
         max-height: 90vh;
+
+        .carousel-inner {
+            img {
+                height: 100%;
+                width: 100%;
+                object-fit: scale-down;
+            }
+        }
     }
 
     .carousel-control-prev .fa {