folder_contents Configure display column dialog half visible

[vincentfretin]

BUG/PROBLEM REPORT (OR OTHER COMMON ISSUE)

What I did:

Create a Plone site in German Go in folder contents, click on "Configure display column"

What I expect to happen:

The dialog should be completely visible.

What actually happened:

The dialog is half visible, some part is below the toolbar

This is what it looks like in English:

What version of Plone/ Addons I am using:

Plone 5.2.1

[vincentfretin]

When I put plone-editor-tools bundle js in develop mode, the issue is fixed! So the issue was surely fixed by someone, but the bundle wasn't rebuild?

[vincentfretin]

The question now is how to build this bundle to include it in a new release? I don't have a clue. Someone knows?

[vincentfretin]

To create the new bundles, the documentation is at https://github.com/plone/plone.staticresources

[vincentfretin]

The bundles have been updated recently by @thet last_compilation 2020-06-16 10:10:00 and I see in plone.staticresources package.json with the latest commit of mockup master https://github.com/plone/mockup.git#e6bd1977871c7dbeb75b0eccc395687320e681b8

Huh, now I played a little bit with plone.staticresources it appears this is not an issue with released vs develop mode, weird. I can reproduce the issue in develop mode. The issue is not existing in plone.staticresources 1.2.1, it only occurs on master.

We have those CSS rules:

http://0.0.0.0:8080/Plone/++plone++static/++unique++2020-06-21%2010%3A20%3A26.676322/src/plone.staticresources/src/plone/staticresources/static/components/bootstrap/less/popovers.less
.pat-structure .popover {
 z-index: 1060;
}

http://0.0.0.0:8080/Plone/++plone++static/++unique++2020-06-21%2010%3A20%3A26.676322/src/mockup/mockup/patterns/structure/less/pattern.structure.less
.pat-structure .navbar, .pat-structure .pat-structure .navbar {
 z-index: 10;
}

toolbar is z-index: 20

This is what changed, in the DOM, now we have:

<div class="navbar ui-offset-parent>
  <div id="popover-structure-columns" class="popover attribute-columns ui-offset-parent active bottom">
  </div>
</div>

And before we had

<div class="navbar ui-offset-parent></div>
<div id="popover-structure-columns" class="popover attribute-columns ui-offset-parent active bottom"></div>

[vincentfretin]

[vincentfretin]

I couldn't find what changed in the js to have a different DOM like this. The issue can be fixed by changing the CSS rule for .pat-structure .navbar from z-index: 10 to z-index: 1060. I'm not sure if this can lead to other regressions somewhere else.

[vincentfretin]

I did the css fix there https://github.com/plone/mockup/pull/986/commits/a6fa639b9e80ec04d9143bf451e73fd51d6ff0ae waiting merge of https://github.com/plone/mockup/pull/986

[vincentfretin]

This issue was a regression because of https://github.com/plone/mockup/pull/964 The z-index of children is only applied within the same stacking context, see https://coder-coder.com/z-index-isnt-working/ for more details.

[vincentfretin]

The fix I did included in mockup 3.2.0 did regressions with submenu in Plone toolbar and portal tabs subtrees simlar to https://github.com/plone/Products.CMFPlone/issues/2307 that was actually fixed before. My new PR https://github.com/plone/mockup/pull/1002 revert the previous fix and fix this issue in a different way.