From 6f653ac6a608f9e79b060760dc18b24f4b05a5e3 Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Thu, 20 Jun 2019 09:45:04 +0000
Subject: [PATCH] [FIX] web_editor: allow fullscreen editor even when inside
modal
The new editor of https://github.com/odoo/odoo/pull/29775 came with a
fullscreen option. When using the toggle when the editor is in inside
a modal, the editor stretched only to match the size of the modal
instead of the viewport.
This is because the 'position: fixed' rule which is used to achieve the
fullscreen layout cannot work if a parent of the element has a CSS
transform applied on it. Indeed in that case, that element acts like the
viewport for 'position: fixed' elements.
closes odoo/odoo#34272
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
---
addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js | 6 ++++++
addons/web_editor/static/src/scss/wysiwyg_iframe.scss | 4 ++++
2 files changed, 10 insertions(+)
diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
index 0d75f360731c..25e1e734e141 100644
--- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
+++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg_iframe.js
@@ -68,6 +68,8 @@ Wysiwyg.include({
}
$(document.body).off('.' + this.id);
+ this.$iframe.parents().removeClass('o_wysiwyg_no_transform');
+
this.$target.insertBefore(this.$iframe);
delete window.top[this._onUpdateIframeId];
@@ -100,6 +102,10 @@ Wysiwyg.include({
}
self.$iframe.toggleClass('o_fullscreen');
self.$iframe.contents().find('body').toggleClass('o_fullscreen');
+
+ // Hack to avoid a parent of the fullscreen iframe to have a
+ // transform (otherwise the position: fixed won't work)
+ self.$iframe.parents().toggleClass('o_wysiwyg_no_transform');
},
isFullscreen: function () {
if (!self.$iframe) {
diff --git a/addons/web_editor/static/src/scss/wysiwyg_iframe.scss b/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
index d019fdce7530..1124d9033533 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_iframe.scss
@@ -10,6 +10,10 @@ iframe.wysiwyg_iframe.o_fullscreen {
border: 0;
}
+.o_wysiwyg_no_transform {
+ transform: none !important;
+}
+
body.o_in_iframe {
background-color: $o-view-background-color;
overflow: hidden;
--
GitLab