Drag and drop - clarify drop zones and whether the drag and drop will work.

[Addison-Stavlo]

What problem does this address?

In recent testing there has been a bit of confusion when trying to utilize drag and drop and why it doesnt work as expected in various circumstances.

In the gif below, we see a failed attempted drag and drop. This is because we are trying to drag a column into another column, but there until the item is dropped and the move fails there is no distinction that this is problematic (or why). While it is clear to us that a column cannot be moved inside a column, as a standard interaction on theme provided content it confuses users who may be thinking "why cant I move these social links to the lower part of the footer?".

Similar issues have been seen with ambiguity in the drop-zone, such as trying to move a Site Title block to the other column in the header but failing because the drop-zone is actually the navigation block inside the column and not the column itself.

What is your proposed solution?

Showing more block boundaries while drag and drop is in progress could serve to help with the confusion of where the item is being dropped.

We could change the color on the focused outlined to 'red' (or not show it at all) when the dropzone is an invalid target for the selected block. This would help give clarity that the action is invalid before trying to trigger it.

[talldan]

Related: #24174

[talldan]

Doing some organization, and going to close this one as a duplicate of #24174 and #24750, which I think covers the two points.