Vertical toolbar in “Zoom Out” position for non fullwidth blocks

[stokesman]

Description

The new vertical toolbar from #60123 is cool. I've noticed that on a theme with a dark background when a content block that isn’t full width is selected, the toolbar sits over the canvas and can be pretty much invisible. I would expect that the toolbar should always have good visibility regardless of the theme’s background.

Step-by-step reproduction instructions

1. Select a theme with a dark background or change your theme’s background to a dark one
2. Open the Inserter, go to the Patterns tab and select a pattern category
3. Select a block that is not full-width
4. Notice the toolbar buttons are hard (maybe impossible) to see

Screenshots, screen recording, code snippet

Environment info

• WP 6.5 / Gutenberg Trunk / Twenty Twenty-Four
• Chrome
• Desktop macOS

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

[richtabor]

I removed the Needs Design label; this is a bug as the vertical toolbar should always reside outside the site contents. Instead it looks the the vertical toolbar is always to the left of the content, rather than always on the outside.

cc @scruffian @MaggieCabrera

[richtabor]

Ideally the toolbar is not reliant on the width of the block, but the canvas itself. Another alternative is to only have the toolbar render for fullwidth blocks (at least a temporary measure to try first). cc @MaggieCabrera

[scruffian]

Fixed by #63650