[IMP] web_editor, website: improve editor loading effects

- Share the code for tab switching loading and slow option loading.
- Now add a loading effect over the content when the content is changed
  and a loading effect over the editor panel when the editor panel is
  being changed

Part of https://github.com/odoo/odoo/pull/55614
task-2213114

closes odoo/odoo#55614

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

1 files changed, 14 insertions, 0 deletions

diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
index 404646b0584..f01bcb710a0 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
@@ -1731,3 +1731,17 @@ we-select.o_we_shape_menu {
         }
     }
 }
+
+.o_we_ui_loading {
+    @include o-position-absolute(0, 0, 0, 0);
+    z-index: $o-we-zindex;
+    background-color: $o-we-sidebar-content-backdrop-bg;
+    color: $o-we-fg-lighter;
+}
+#oe_manipulators > .o_we_ui_loading {
+    // hacky solution to be over the content, ideally that loader should only
+    // be over the content being reloaded (with a covering similar to the editor
+    // overlay covering).
+    position: fixed;
+    left: $o-we-sidebar-width;
+}