[IMP] html_builder: change bring up/down icons

This commit adds new icons Odoo UI icons for the send to back/bring to
front functionality.

+ other new Odoo UI icons for task-5061915

task-5173190

Author: ldau-odoo

addons/html_builder/static/src/core/grid_layout/grid_layout_plugin.js

@@ -100,12 +100,12 @@ export class GridLayoutPlugin extends Plugin {
         if (!this.config.isMobileView(this.overlayTarget)) {
             buttons.push(
                 {
-                    class: "o_send_back oi",
+                    class: "oi-move-down oi",
                     title: _t("Send to back"),
                     handler: this.sendGridItemToBack.bind(this),
                 },
                 {
-                    class: "o_bring_front oi",
+                    class: "oi-move-up oi",
                     title: _t("Bring to front"),
                     handler: this.bringGridItemToFront.bind(this),
                 }

addons/html_builder/static/src/core/overlay_buttons/overlay_buttons.scss

@@ -11,22 +11,4 @@
     button.o_move_handle {
         cursor: move;
     }
-
-    button.o_send_back, button.o_bring_front {
-        background-position: center;
-        background-repeat: no-repeat;
-
-        &::before {
-            // Hack to give a width to the buttons and apply paddings.
-            content: "\00a0\00a0\00a0";
-        }
-    }
-
-    button.o_send_back {
-        background-image: url('/html_builder/static/img/options/bring-backward.svg');
-    }
-
-    button.o_bring_front {
-        background-image: url('/html_builder/static/img/options/bring-forward.svg');
-    }
 }

addons/web/static/lib/odoo_ui_icons/fonts/odoo_ui_icons.woff

@@ -92,6 +92,9 @@
 .oi-google-play:before { content: '\e81d'; }
 .oi-strava:before { content: '\e80f'; }
 .oi-discord:before { content: '\e811'; }
+.oi-move-up:before { content: '\e84c'; }
+.oi-move-down:before { content: '\e84d'; }
+.oi-life-ring-plus:before { content: '\e849'; }
 
 /* RTL adaptations. */
 /* Flip directional icons by 180 degree. */

addons/web/static/lib/odoo_ui_icons/fonts/odoo_ui_icons.woff2

@@ -83,13 +83,13 @@ test("Use the 'grid' overlay buttons", async () => {
 
     await contains(":iframe .g-col-lg-5").click();
     expect(".overlay .o_overlay_options").toHaveCount(1);
-    expect(".overlay .o_send_back").toHaveCount(1);
-    expect(".overlay .o_bring_front").toHaveCount(1);
+    expect(".overlay .oi-move-down").toHaveCount(1);
+    expect(".overlay .oi-move-up").toHaveCount(1);
 
-    await contains(".overlay .o_send_back").click();
+    await contains(".overlay .oi-move-down").click();
     expect(":iframe .g-col-lg-5").toHaveStyle({ zIndex: "0" });
 
-    await contains(".overlay .o_bring_front").click();
+    await contains(".overlay .oi-move-up").click();
     expect(":iframe .g-col-lg-5").toHaveStyle({ zIndex: "2" });
 });
 
@@ -114,13 +114,13 @@ test("Refresh the overlay buttons when toggling the mobile preview", async () =>
 
     await contains(":iframe .g-col-lg-4").click();
     await contains("[data-action='mobile']").click();
-    expect(".overlay .o_send_back, .overlay .o_bring_front").toHaveCount(0);
+    expect(".overlay .oi-move-down, .overlay .oi-move-up").toHaveCount(0);
     expect(".overlay .fa-angle-left").toHaveCount(1);
     expect(".overlay .fa-angle-right").toHaveCount(1);
 
     await contains("[data-action='mobile']").click();
-    expect(".overlay .o_send_back").toHaveCount(1);
-    expect(".overlay .o_bring_front").toHaveCount(1);
+    expect(".overlay .oi-move-down").toHaveCount(1);
+    expect(".overlay .oi-move-up").toHaveCount(1);
     expect(".overlay .fa-angle-left, .overlay .fa-angle-right").toHaveCount(0);
 });