Skip to content

CoBlocks Animations: Navigation Block Mobile Menu Hidden When Inside an Animated Group Block #97746

Closed
@mxhassani

Description

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

  1. Open/create an atomic site
  2. Make sure it uses an FSE theme
  3. Make sure coBlocks plugin is installed and active
  4. Go to the editor
  5. Create a navigation block and add some links to it
  6. Make sure the nav block overlay menu is set to Always or Mobile
  7. Put that nav block inside a group block.
  8. Add an animation to the group block (zoom-in effect is good here)
  9. Save and check in front end

What you expected to happen

The navigation menu to show correctly (full page)

Image

What actually happened

It shows only partially, using only the initial height of the header block.
Image

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

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

Customer ReportIssues or PRs that were reported via Happiness. Previously known as "Happiness Request".[Closed] Won't FixNo intention to address issue.[Feature Group] Editor ExperienceFeatures related to Gutenberg integration on WordPress.com.[Feature] CoBlocksThe integration of GoDaddy's CoBlocks plugin on WordPress.com Atomic sites.[Platform] Atomic[Pri] LowAddress when resources are available.[Product] WordPress.comAll features accessible on and related to WordPress.com.[Type] BugWhen a feature is broken and / or not performing as intended

Type

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions