[REF] web, *: BS4, use custom BS4 checkbox everywhere

Before this commit, Odoo used checkboxes in three different ways:

- A simple <input type="checkbox"/>, mainly in the frontend. The style
  is browser dependant.

- Same as above but with the BS3, checkbox structure. The style is still
  the same, but the alignement is supposed to be better (which is not
  always the case).

- The Odoo official structure:
	```
	<div class="o_checkbox">
	    <input type="checkbox"/>
	    <span/>
	</div>
	```
  which allows to have a cross-browser checkbox style and correct
  alignements.

The goal after this commit is to only use the BS4 *custom* checkbox
structure to achieve the same goal as our official structure (and
remove that one):

```
<div class="custom-control custom-checkbox">
  <input type="checkbox" class="custom-control-input" id="customCheck1">
  <label class="custom-control-label" for="customCheck1">...</label>
</div>
```

/!\ Labels are now required (use a zero-width space if necessary)

2 files changed, 13 insertions, 7 deletions

diff --git a/addons/web_editor/static/src/scss/web_editor.ui.scss b/addons/web_editor/static/src/scss/web_editor.ui.scss
index 34b921c49da..771f4a938ad 100644
--- a/addons/web_editor/static/src/scss/web_editor.ui.scss
+++ b/addons/web_editor/static/src/scss/web_editor.ui.scss
@@ -1254,7 +1254,7 @@ body.editor_enable {
                 align-items: center;
                 font-size: 11px;
 
-                > .o_checkbox {
+                > .custom-control {
                     margin-right: $grid-gutter-width/4;
                 }
             }
diff --git a/addons/web_editor/static/src/xml/ace.xml b/addons/web_editor/static/src/xml/ace.xml
index 800a0ef2ced..c78ce8a4d4a 100644
--- a/addons/web_editor/static/src/xml/ace.xml
+++ b/addons/web_editor/static/src/xml/ace.xml
@@ -14,16 +14,22 @@
             <select id="ace-view-list" class="o_res_list"/>
             <select id="ace-scss-list" class="o_res_list d-none"/>
             <label class="o_include_option oe_include_bundles">
-                <div class="o_checkbox">
-                    <input type="checkbox" class="js_include_bundles" t-att-checked="widget.options.includeBundles ? 'checked' : undefined"/><span/>
+                <div class="custom-control custom-checkbox">
+                    <input type="checkbox" id="o_ace_view_editor_include_bundle"
+                        class="custom-control-input js_include_bundles"
+                        t-att-checked="widget.options.includeBundles ? 'checked' : undefined"/>
+                    <label for="o_ace_view_editor_include_bundle"
+                        class="custom-control-label">Include Asset Bundles</label>
                 </div>
-                Include Asset Bundles
             </label>
             <label class="o_include_option o_include_all_scss d-none">
-                <div class="o_checkbox">
-                    <input type="checkbox" class="js_include_all_scss" t-att-checked="widget.options.includeAllSCSS ? 'checked' : undefined"/><span/>
+                <div class="custom-control custom-checkbox">
+                    <input type="checkbox" id="o_ace_view_editor_include_all_scss"
+                        class="custom-control-input js_include_all_scss"
+                        t-att-checked="widget.options.includeAllSCSS ? 'checked' : undefined"/>
+                    <label for="o_ace_view_editor_include_all_scss"
+                        class="custom-control-label">Include All SCSS Files</label>
                 </div>
-                Include All SCSS Files
             </label>
             <div class="o_button_section">
                 <button data-action="save" type="submit" class="btn btn-primary">Save</button>