[IMP] web_editor: review floating toolbar and its SCSS structure

The "floating" and the "into-sidebar" toolbar designs are visually very
different but share the same XML template.

Prior to this commit we relied on SCSS overrides to achieve the two
designs, meaning that any new rule added in wysiwyg.scss was supposed to
be followed by an override in wysiwyg_snippets.scss.

This approach led to glitches and undesired behaviors, especially
considering that all customizations we apply are already overrides of
the standalone OdooEditor lib (that, by the way, applies its own
overrides on top of bootstrap too...).

This commit will add the 'oe-floating' class by default, and will
remove it when the toolbar is rendered inside the sidebar.

This approach allows to target the floating design when needed only, and
consequentially will leave the '.oe-toolbar' selector for the code
shared between the two designs.

Part of https://github.com/odoo/odoo/pull/73565
task-2496339

Part-of: odoo/odoo#73565

addons/web_editor/static/src/js/editor/snippets.editor.js

@@ -3110,6 +3110,8 @@ var SnippetsMenu = Widget.extend({
                 break;
         }
 
+        this.options.wysiwyg.toolbar.el.classList.remove('oe-floating');
+
         const $customizeBlock = $('<WE-CUSTOMIZEBLOCK-OPTIONS id="o_we_editor_toolbar_container"/>');
         const $title = $("<we-title><span>" + titleText + "</span></we-title>");
 

addons/web_editor/static/src/scss/wysiwyg.scss

@@ -28,7 +28,18 @@ $o-we-zindex: $o-we-overlay-zindex + 1 !default;
     margin: 0;
     padding: 0;
 }
+
+// Toolbar - Generic rules shared among backend & frontend
 .oe-toolbar {
+    .btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+}
+
+// Floating Toolbar
+.oe-toolbar.oe-floating {
     padding-bottom: 0;
     border-bottom: $o-we-border-width solid $o-we-fg-light;
     background-color: $o-we-bg;

addons/web_editor/static/src/xml/editor.xml

@@ -6,7 +6,7 @@
 
     <!-- Editor toolbar -->
     <t t-name="web_editor.toolbar">
-        <div id="toolbar" class="oe-toolbar">
+        <div id="toolbar" class="oe-toolbar oe-floating">
             <div id="style" class="btn-group dropdown">
                 <button type="button" class="btn dropdown-toggle"
                     data-toggle="dropdown" title="Text style" tabindex="-1" data-display="static"