Description

A number of Editor toolbar issues were reported in #52648 (comment), but I wanted to have a separate issue specifically for these bugs.

Yes, I still have the toolbar issue with WP 6.3 Beta 4 + Gutenberg Nightly.
In my tests the Tablet and Mobile previews of the Post Editor behave like this:

• when the option "Top toolbar" is not selected, the toolbar is completely hidden behind the "Editor top bar"
• when "Top toolbar" is selected and "Fullscreen mode" is not, the toolbar is visible, but weiredly overlaying the "Editor top bar", in fact overlaping the preview controls.
• when both "Top toolbar" and "Fullscreen mode" are selected, the toolbar is usable, but still strangely integrated into the "Editor top bar".
• when "Distraction free" is actived, you can see the overlapping of the the elements while transitioning by hovering.
• when you scale the browser to less than 782px (mobile/tablet size), the toolbar is back to its original position below the "Editor to bar" and usable again.
• Seems to be related to Stabilize the Title Bar #50378

I was also able to identify an additional issue related to the size of the "Top toolbar", notice the "Saved" message is partially hidden.

This becomes worse when plugins like Yoast are enabled. The width appears to be hardcoded and does not consider additional plugins.

Step-by-step reproduction instructions

1. Using WordPress 6.3 Beta 4+ and/or Gutenberg 16.2, navigate to the Editor and enable "Top toolbar".
2. Select a Paragraph block and see that the Top toolbar partially covers the save message
3. Enable a plugin like Yoast that renders an icon (plugin) in the Toolbar.
4. Observe that the entire save message is now covered with selecting a Paragraph block

Screenshots, screen recording, code snippet

No response

Environment info

• WordPress 6.3 Beta 4
• Gutenberg trunk

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes