Login/out: add spacing support

[carolinan]

What?

Adds margin and padding support to the login/out block.

Why?

For consistency. Part of #45147.

How?

The PR adds spacing support to block.json.

Testing Instructions

Make sure that the active theme supports spacing, for example, in theme.json.
Create a new post or page.
Add login/out block.
Confirm that there is a dimension panel, and that the margin and padding settings are available but not enabled by default.
Test the margin and padding settings in the editor and front.

-Go to the Site Editor, add a login/out block, and change the margin and padding via the block settings in the Styles sidebar.
-Adjust the spacing and margin via theme.json.

Example theme.json code: add this to styles > blocks:

"core/loginout": {
				"spacing": {
					"padding": {
						"top": "15px",
						"right": "15px",
						"bottom": "15px",
						"left": "15px"
					},
					"margin": {
						"top": "150px",
						"right": "15px",
						"bottom": "150px",
						"left": "15px"
					}
				}
			},

Screenshots or screencast

login-out.mp4

[codesandbox]

  Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

[github-actions]

Flaky tests detected in 652fae1.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/5517930788
📝 Reported issues:

• [Flaky Test] Block context propagates to inner blocks #48827 in specs/editor/plugins/block-context.test.js
• [Flaky Test] should open a preview window for a new post #35387 in /test/e2e/specs/editor/various/preview.spec.js

[carolinan]

Left and right margin isn't doing anything in the block editor if "Inner blocks use content width" is enabled. How should we handle it? Only enable vertical margin?

[aaronrobertshaw]

Thanks for continuing to chip away at design tool adoption @carolinan 👍

Left and right margin isn't doing anything in the block editor if "Inner blocks use content width" is enabled. How should we handle it? Only enable vertical margin?

Other blocks still adopt support for horizontal margins as individual blocks can be nested within a container block. In that case, the individual block isn't constrained by layout styles.

With regards to this PR, the spacing support styles for this block are working as I'd expect them to.

There's one small tweak I think needs to be made though. With #52256 blocks such as this one are having their dimension controls hidden by default. I think we should do the same here.

I've left the suggested tweak as an inline comment.

[aaronrobertshaw]

LGTM and is working as advertised 👍

The spacing controls are now hidden by default and match other blocks.

Thanks for your patience on this @carolinan 🙇

[carolinan]

Got to catch them all... I mean, fix them all ;) Even if it takes time.