Site editor: bump the z-index of the rename modal#54277
Conversation
…dropdown popover component, which is set to 1000000 in the component stylesheet
andrewserong
left a comment
There was a problem hiding this comment.
Oh, great catch! Just wondering if we should add another entry in _z-index.scss for keeping track, rather than adding 1 to the .components-popover value?
The +1 is unnecessary thanks to document tree order.
…' into update/rename-modal-bump-z-index # Conflicts: # packages/edit-site/src/components/template-actions/style.scss
|
Size Change: -1 B (0%) Total Size: 1.52 MB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Nice, thanks for the update!
This is testing well for me and has the right z-index:
Possibly for a follow-up, but I see that there are existing rules for .edit-site-list__rename-modal and .edit-site-template__actions over in components/list/style.scss. Since this adds a stylesheet to template-actions/style.scss, would it be good to co-locate the rules?
gutenberg/packages/edit-site/src/components/list/style.scss
Lines 132 to 144 in 119a279
Not a blocker though, LGTM! ✨
| onClose(); | ||
| } } | ||
| overlayClassName="edit-site-list__rename_modal" | ||
| overlayClassName="edit-site-list__rename-modal" |
There was a problem hiding this comment.
Also, I wanted to say, eagle eyes here! I took me a few seconds of staring to see the typo fix 😄
How did I miss that? 🤦🏻 Much better to move the z-index rule to the existing stylesheet. Thank you! I'll do that here |

What?
This PR bumps the rename modal
z-indexto be one higher than the dropdown popover component, which is set to1000000.I noticed this while working on #54271
Why?
So that the rename modal sits above the actions dropdown:
Testing Instructions
Create a custom template and pattern. In the site editor, click on the actions ellipsis in the individual views and rename. Also check the patterns grid.
To ensure that modal hovers over the open dropdown element, reduce the dimensions of your browser.
The modal and its background should be above the dropdown.
Thank you!
Screenshots or screencast