-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix navigation block classname issues #34344
Conversation
@@ -44,6 +44,15 @@ const MyNavigation = () => ( | |||
</Navigation> | |||
); | |||
``` | |||
## CSS Classes leveraged |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let me know if this is the right place and/or format for these.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good, thanks for doing that. 👍
Size Change: +30 B (0%) Total Size: 1.04 MB
ℹ️ View Unchanged
|
@jasmussen I'm seeing a wider range of styling issues for the core navigation block editor styles. For this I'm turning off the 'Use theme styles' option in the editor to see what the base styles are like:
|
Thank you for the thorough testing! I'll get those fixed up 👌 |
Thanks again for the excellent bug report, it helped me trace the issue to #34258. I believe the change I just pushed fixes all the issues you mention: |
I wanted to expand on this one, this lack of margin is intentional so as to enable navigation designs that are meant to be "lists of links". Some more details in #30805. You can still adjust the line height, or add background color, which both affect the vertical spacing: Those margins also have reduced specificity so that you can set them via global styles. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks, lets move forwards with this. I'm still seeing many of the issues I mentioned (testing using TT1 with theme editor styles disabled). Hopefully they can be fixed as a followup.
Thanks for the review. There are some issues that have to be fixed in TT1 itself, and which we can't fix in the navigation block lest we break global styles. |
Description
Followup to issues caused by #34171. Classnames were changed and made generic, this PR catches a few that I missed the first time around.
How has this been tested?
Please test the navigation block empty, empty unselected, with menu items including dropdowns, with the Page List that also includes submenu items.
Please test the navigation scren.
Note that while this PR slightly improves the navigation screen, it doesn't go as far as #34281 does, which includes some further CSS changes to make the chevron metrics and rotation work better. Happy to include this here if need be, but wanted to keep it to just classname fixes for a start.
Screenshots
Before:
After:
Checklist:
*.native.js
files for terms that need renaming or removal).