Disable `transform: translate` when entering fullscreen mode in the editor

The transform of `.anchorFixedHeader` introduces a new stacking context which will cause `position: fixed` inside to be relative to the container, instead of the document.

diff --git a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFullscreen.js b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFullscreen.js
index 150bfcd5ffdc6f3386684ca1f43f64b0f2801fae..841657bd4dda7f3bba9f16a999cee9d337564117 100644 (file)
--- a/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFullscreen.js
+++ b/wcfsetup/install/files/js/3rdParty/redactor2/plugins/WoltLabFullscreen.js
@@ -35,6 +35,9 @@ $.Redactor.prototype.WoltLabFullscreen = function() {
                        _button.children[0].classList.toggle('fa-compress');
                        _button.children[0].classList.toggle('fa-expand');
                        
+                       var anchorFixedHeader = elClosest(this.core.box()[0], '.anchorFixedHeader');
+                       if (anchorFixedHeader) anchorFixedHeader.classList.toggle('disableAnchorFixedHeader');
+                       
                        if (this.core.box()[0].classList.toggle('redactorBoxFullscreen')) {
                                WCF.System.DisableScrolling.disable();
                                _active = true;

diff --git a/wcfsetup/install/files/style/ui/message.scss b/wcfsetup/install/files/style/ui/message.scss
index 282b8e025f53e6fbcc88ad2c4b52ea116f5eb237..b7008b870f4a3b4fa092b33d7bac50d01c769065 100644 (file)
--- a/wcfsetup/install/files/style/ui/message.scss
+++ b/wcfsetup/install/files/style/ui/message.scss
@@ -38,7 +38,7 @@
                }
        }
        
-       > .anchorFixedHeader:target {
+       > .anchorFixedHeader:not(.disableAnchorFixedHeader):target {
                margin-top: -49px;
                pointer-events: none;
                position: relative;