Animations: Navigation Block Mobile Menu Hidden When Inside an Animated Group Block #97746
Open
Description
opened on Dec 23, 2024
Quick summary
Having an animation added to a Group block that contains a Navigation block, prevents the navigation block mobile from showing all its content.
Steps to reproduce
- Open/create an atomic site
- Make sure it uses an FSE theme
- Make sure coBlocks plugin is installed and active
- Go to the editor
- Create a navigation block and add some links to it
- Make sure the nav block overlay menu is set to Always or Mobile
- Put that nav block inside a group block.
- Add an animation to the group block (zoom-in effect is good here)
- Save and check in front end
What you expected to happen
The navigation menu to show correctly (full page)
What actually happened
It shows only partially, using only the initial height of the header block.
Impact
Some (< 50%)
Available workarounds?
Yes, easy to implement
If the above answer is "Yes...", outline the workaround.
Removing the animation fixes the navigation menu.
Platform (Simple and/or Atomic)
Atomic
Logs or notes
The issue appears to be mainly caused by the Stacking Context change introduced by the animation effect. Making z-index changes not a suitable solution.
One potential fix can be to move the navigation block to a separate wrapper when the context menu is open, and then move it back when closed.
--
9206041-zen
Metadata
Assignees
Labels
Issues or PRs that were reported via Happiness. Previously known as "Happiness Request".Ticket needs to be triagedFeatures related to Gutenberg integration on WordPress.com.The integration of GoDaddy's CoBlocks plugin on WordPress.com Atomic sites.Address when resources are available.All features accessible on and related to WordPress.com.
Type
Projects
Status
Needs Triage
Activity