[MERGE] *: migrate Bootstrap 3.3.7 to 4.1.3

See sub-commits for details.

task-49280
Closes https://github.com/odoo/odoo/pull/25045

3 files changed, 55 insertions, 60 deletions

diff --git a/addons/mass_mailing/static/src/js/mass_mailing_editor.js b/addons/mass_mailing/static/src/js/mass_mailing_editor.js
index c7070e61a31..ec7f01bbc25 100644
--- a/addons/mass_mailing/static/src/js/mass_mailing_editor.js
+++ b/addons/mass_mailing/static/src/js/mass_mailing_editor.js
@@ -28,7 +28,7 @@ options.registry.sizing_x = options.Class.extend({
         this.isIMG = this.$target.is("img");
         if (this.isIMG) {
             this.$overlay.find(".o_handle.w").addClass("readonly");
-            this.$overlay.find(".oe_snippet_move, .oe_snippet_clone").addClass("hidden");
+            this.$overlay.find(".oe_snippet_move, .oe_snippet_clone").addClass('d-none');
         }
 
         var $body = $(document.body);
@@ -197,7 +197,7 @@ snippets_editor.Class.include({
          * Add proposition to install enterprise themes if not installed.
          */
         var $mail_themes_upgrade = $dropdown.find(".o_mass_mailing_themes_upgrade");
-        $mail_themes_upgrade.on("click", "> a", function (e) {
+        $mail_themes_upgrade.on("click", function (e) {
             e.stopImmediatePropagation();
             e.preventDefault();
             odoo_top[window.callback+"_do_action"]("mass_mailing.action_mass_mailing_configuration");
@@ -208,15 +208,15 @@ snippets_editor.Class.include({
          * is pressed.
          */
         var selected_theme = false;
-        $dropdown.on("mouseenter", "li > a", function (e) {
+        $dropdown.on("mouseenter", ".dropdown-item", function (e) {
             if (first_choice) return;
             e.preventDefault();
-            var theme_params = themes_params[$(e.currentTarget).parent().index()];
+            var theme_params = themes_params[$(e.currentTarget).index()];
             switch_theme(theme_params);
         });
-        $dropdown.on("click", "li > a", function (e) {
+        $dropdown.on("click", ".dropdown-item", function (e) {
             e.preventDefault();
-            var theme_params = themes_params[$(e.currentTarget).parent().index()];
+            var theme_params = themes_params[$(e.currentTarget).index()];
             if (first_choice) {
                 switch_theme(theme_params);
                 $body.removeClass("o_force_mail_theme_choice");
@@ -244,7 +244,7 @@ snippets_editor.Class.include({
          */
         $dropdown.on("shown.bs.dropdown", function () {
             check_selected_theme();
-            $dropdown.find("li").removeClass("selected").filter(function () {
+            $dropdown.find(".dropdown-item").removeClass("selected").filter(function () {
                 return ($(this).has(".o_thumb[style=\""+ "background-image: url(" + (selected_theme && selected_theme.img) + "_small.png)"+ "\"]").length > 0);
             }).addClass("selected");
         });
diff --git a/addons/mass_mailing/static/src/scss/mass_mailing.ui.scss b/addons/mass_mailing/static/src/scss/mass_mailing.ui.scss
index eaac6c4d2dd..ed4584cb61b 100644
--- a/addons/mass_mailing/static/src/scss/mass_mailing.ui.scss
+++ b/addons/mass_mailing/static/src/scss/mass_mailing.ui.scss
@@ -14,9 +14,9 @@
         border-radius: 0;
         background-color: $o-we-color-darker;
         color: $o-we-color-text-normal;
-        @include o-flex-display;
-        @include o-justify-content(center);
-        @include o-align-items(center);
+        display: flex;
+        justify-content: center;
+        align-items: center;
 
         &:hover, &:focus, &:active {
             color: $o-we-color-text-light;
@@ -27,7 +27,7 @@
         }
     }
 
-    &.open > a {
+    &.show > a {
         color: white;
         background-color: $o-we-color-dark;
     }
@@ -39,26 +39,23 @@
         overflow: auto;
         background-color: $o-we-color-dark;
 
-        > li {
-            margin: 0;
+        .dropdown-item { 
+            padding: 10px 10px;
 
-            > a {
-                padding: 10px 10px;
-
-                .o_thumb {
-                    display: none;
-                    background-size: cover;
-                    padding-top: 50%;
-                    border: 1px solid $o-we-color-light;
-                    border-top: 1px solid $o-we-color-text-normal;
+            .o_thumb {
+                display: none;
+                background-size: cover;
+                padding-top: 50%;
+                border: 1px solid $o-we-color-light;
+                border-top: 1px solid $o-we-color-text-normal;
 
-                    &.logo {
-                        display: block;
-                    }
+                &.logo {
+                    display: block;
                 }
             }
 
-            &:hover > a {
+
+            &:hover {
                 background-color: $o-we-color-darker;
 
                 .o_thumb {
@@ -66,8 +63,8 @@
                 }
             }
 
-            &.selected > a .o_thumb {
-                border: 2px solid $o-brand-primary;
+            &.selected .o_thumb {
+                border: 2px solid $o-brand-odoo;
                 background-color: $o-we-color-dark;
             }
         }
@@ -86,41 +83,39 @@ body.o_force_mail_theme_choice {
             .dropdown-menu {
                 display: block;
 
-                > li {
+                .dropdown-item {
                     margin: 0;
                     float: left;
+                    clear: none;
                     width: 100%;
                     max-width: 25%;
+                    transition: all 0.3s ease 0s;
+
+                    .o_thumb {
+                        display: none;
+                        padding-top: 107%;
+                        border: 1px solid $o-we-color-light;
+                        border-top: 1px solid $o-we-color-text-normal;
+                        box-shadow: 0 5px 10px rgba(black, 0.8);
+                        will-change: transform;
+                        backface-visibility: hidden;
+                        transition: all 0.3s ease 0s;
+
+                        &.small {
+                            display: block;
+                        }
 
-                    > a {
-                        @include o-transition(all, 0.3s, ease);
-
-                        .o_thumb {
-                            display: none;
-                            padding-top: 107%;
-                            border: 1px solid $o-we-color-light;
-                            border-top: 1px solid $o-we-color-text-normal;
-                            box-shadow: 0 5px 10px rgba(black, 0.8);
-                            will-change: transform;
-                            @include backface-visibility(hidden);
-                            @include o-transition(all, 0.3s);
-
+                        @media screen and (min-width: 900px) {
                             &.small {
-                                display: block;
+                                display: none;
                             }
-
-                            @media screen and (min-width: 900px) {
-                                &.small {
-                                    display: none;
-                                }
-                                &.large {
-                                    display: block;
-                                }
+                            &.large {
+                                display: block;
                             }
                         }
                     }
 
-                    &:hover > a {
+                    &:hover {
                         background-color: $o-we-color-dark;
 
                         .o_thumb {
@@ -128,7 +123,7 @@ body.o_force_mail_theme_choice {
                         }
                     }
 
-                    &.o_mass_mailing_themes_upgrade > a .o_thumb {
+                    &.o_mass_mailing_themes_upgrade .o_thumb {
                         position: relative;
                         display: block;
                         border: 1px dashed white;
diff --git a/addons/mass_mailing/static/src/xml/mass_mailing.xml b/addons/mass_mailing/static/src/xml/mass_mailing.xml
index ae79ebff979..266d7931ec5 100644
--- a/addons/mass_mailing/static/src/xml/mass_mailing.xml
+++ b/addons/mass_mailing/static/src/xml/mass_mailing.xml
@@ -1,22 +1,22 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates id="template" xml:space="preserve">
     <div t-name="mass_mailing.theme_selector" class="o_mail_theme_selector">
-        <a role="button" href="#" class="btn btn-xs dropdown-toggle" data-toggle="dropdown">
+        <a role="button" href="#" class="btn btn-sm dropdown-toggle" data-toggle="dropdown">
             <i class="fa fa-paint-brush"/> Change Style
         </a>
         <div class="dropdown-menu" role="menu">
-            <li t-foreach="themes" t-as="theme">
-                <a role="menuitem" href="#">
+            <t t-foreach="themes" t-as="theme">
+                <a role="menuitem" href="#" class="dropdown-item">
                     <div class="o_thumb small"  t-attf-style="background-image: url(#{theme.img}_small.png)"/>
                     <div class="o_thumb large" t-attf-style="background-image: url(#{theme.img}_large.png)"/>
                     <div class="o_thumb logo" t-attf-style="background-image: url(#{theme.img}_logo.png)"/>
                 </a>
-            </li>
-            <li t-if="themes.length === 1" class="o_mass_mailing_themes_upgrade">
-                <a role="menuitem" href="#">
+            </t>
+            <t t-if="themes.length === 1">
+                <a role="menuitem" href="#" class="dropdown-item o_mass_mailing_themes_upgrade">
                     <div class="o_thumb"><i class="fa fa-plus" role="img" aria-label="Upgrade theme" title="Upgrade theme"/></div>
                 </a>
-            </li>
+            </t>
         </div>
     </div>
 </templates>