fix: alignment of secondary menu on mobile #4015

[GrigoreMihai]

Summary

Changes the spacing between the text and submenu toggle to keep the elements aligned to the center on mobile even when a submenu is not present.

It also accounts for the previous fix for the submenu alignment #3980 ie. it keeps the elements aligned when the submenu toggle is present.

Will affect visual aspect of the product

YES

Screenshots

Alignment on mobile when submenu is present

Alignment for the secundary menu when submenu's are defined for the primary menu

Test instructions

First we need to test that the secundary menu is aligned to center on mobile as in the issue description:

1. Create a primary and a secondary menu, without any submenus
2. Add the primary menu on desktop and the secondary menu in the mobile sidebar
3. Set the mobile sidebar alignment to center and check the frontend
4. Create a submenu for the primary menu and check again the mobile sidebar in frontend
5. Check that the secundary menu is aligned to the center on mobile.

We also need to ensure we do not introduce a regression by breaking the fix for #3980.

For this the steps are:

1. Create a primary menu with submenu's.
2. Add the primary menu to the mobile and set the Mobile sidebar to the Center .
3. Check the alignment between the menu elements.

Check before Pull Request is ready:

• I have written a test and included it in this PR
• I have run all tests and they pass
• The code passes when running the PHP CodeSniffer
• Code meets WordPress Coding Standards for PHP, HTML, CSS and JS
• Security and Sanitization requirements have been followed
• I have assigned a reviewer or two to review this PR (if you're not sure who to assign, we can do this step for you)

Closes #4015.

[pirate-bot]

Plugin build for 52fe778 is ready 🛎️!

• Download build

[irinelenache]

@GrigoreMihai Tested and the issue is fixed now, thank you 🚀

[pirate-bot]

🎉 This PR is included in version 3.7.5 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀