From e64b93a6cbede93da84099953ca45cca654e700a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Souk=C3=A9ina=20Bojabza?= <sobo@odoo.com>
Date: Wed, 16 Nov 2022 12:38:53 +0000
Subject: [PATCH] [FIX] website, website_sale: convert `form-control-file`
 class to BS5

From BS4 to BS5, the `form-control-file` class has disappeared and
became `form-control`.

This commit replaces the occurrences of the old class by the new one.
It is necessary because by letting the old class, it is impossible to
place a form label above a `File Upload` field.

Indeed, since the `.form-control-file` CSS rule setting the `display`
property to `block` has been removed, the file input now has `display:
inline-block` by default, which is why the label would end up on the
same line as the input, instead of on top. With `.from-control`, this
rule is back, allowing to place the label on top again.

After this commit, the look of the file input will change. This is
because in BS4, with the `form-control-file` class, the input was the
browser native one. It could be customized using `.custom-file` (and
the associated `custom-file-*` classes). But in BS5, the file input is
directly a custom one, thanks to custom styles added on top of `.form-
control`.

task-3071151

closes odoo/odoo#114261

X-original-commit: 7dcfe19c15bd96d65e5fda463ad65d083c6b8fcf
Related: odoo/enterprise#37744
Signed-off-by: Arthur Detroux (ard) <ard@odoo.com>
---
 addons/website/static/src/snippets/s_website_form/000.js  | 2 +-
 .../website/static/src/snippets/s_website_form/001.scss   | 8 --------
 addons/website/static/src/xml/website_form_editor.xml     | 2 +-
 addons/website_sale/views/templates.xml                   | 2 +-
 4 files changed, 3 insertions(+), 11 deletions(-)

diff --git a/addons/website/static/src/snippets/s_website_form/000.js b/addons/website/static/src/snippets/s_website_form/000.js
index 05810a9157c..0c532231d05 100644
--- a/addons/website/static/src/snippets/s_website_form/000.js
+++ b/addons/website/static/src/snippets/s_website_form/000.js
@@ -445,7 +445,7 @@ odoo.define('website.s_website_form', function (require) {
                 });
 
                 // Update field color if invalid or erroneous
-                const $controls = $field.find('.form-control, .form-select, .form-check-input, .form-control-file');
+                const $controls = $field.find('.form-control, .form-select, .form-check-input');
                 $field.removeClass('o_has_error');
                 $controls.removeClass('is-invalid');
                 if (invalid_inputs.length || error_fields[field_name]) {
diff --git a/addons/website/static/src/snippets/s_website_form/001.scss b/addons/website/static/src/snippets/s_website_form/001.scss
index 1ac1542e18a..dcd5accd916 100644
--- a/addons/website/static/src/snippets/s_website_form/001.scss
+++ b/addons/website/static/src/snippets/s_website_form/001.scss
@@ -64,14 +64,6 @@
             display: none;
         }
     }
-
-    .form-control-file.is-invalid {
-        // Note: BS5 use form-control on file inputs now, but this is kept as
-        // compatibility for now (also at the time this was done, Odoo 16.0 uses
-        // BS5 but not yet(?) form-control on file inputs).
-        padding-left: 3px;
-        border-left: 3px solid $form-feedback-invalid-color;
-    }
 }
 
 body:not(.editor_enable) .s_website_form[data-vcss="001"] {
diff --git a/addons/website/static/src/xml/website_form_editor.xml b/addons/website/static/src/xml/website_form_editor.xml
index ee2888a19dc..e56a0fff30d 100644
--- a/addons/website/static/src/xml/website_form_editor.xml
+++ b/addons/website/static/src/xml/website_form_editor.xml
@@ -376,7 +376,7 @@
         <t t-call="website.form_field">
             <input
                 type="file"
-                class="form-control-file s_website_form_input"
+                class="form-control s_website_form_input"
                 t-att-name="field.name"
                 t-att-required="field.required || field.modelRequired || None"
                 t-att-multiple="multiple"
diff --git a/addons/website_sale/views/templates.xml b/addons/website_sale/views/templates.xml
index 65c78b4f15d..74565c3bc1e 100644
--- a/addons/website_sale/views/templates.xml
+++ b/addons/website_sale/views/templates.xml
@@ -1315,7 +1315,7 @@
                                                         <span class="s_website_form_label_content">Upload a document</span>
                                                     </label>
                                                     <div class="col-sm">
-                                                        <input id="sale3" type="file" class="form-control-file s_website_form_input" name="a_document" />
+                                                        <input id="sale3" type="file" class="form-control s_website_form_input" name="a_document" />
                                                     </div>
                                                 </div>
                                             </div>