Creating a clear difference between types of blocks

[paaljoachim]

We need a clear distinction between various kinds of blocks:
The standard blocks used for the layout. (All the regular blocks we have today.)
Reusable Blocks <-> Global Blocks (we need to define each kind of block type)
Template Blocks
Inner Blocks

Creating a visual que for each kind of block.

A standard paragraph block. On hover shows the label (Paragraph). Label should also be clickable. A thin blue outline.

Inner Blocks
A standard column block. On Hover shows the label Column -> Paragraph. Clicking Column label should then select the parent Column. Clicking Paragraph label should select the child paragraph block.
A thin blue outline.

New suggestion:
On Hover shows the inner selected block and the parent block, so the user gets an overview of the connection between inner and outer blocks.

I have added some transparency to the parent block. I have also added a thicker outline around the child/inner block to show that it is being hovered over.
The label word Column and the inner block Paragraph should become clickable.

---

Reusable block

Adding a dash of green to the outline as well as showing the two columns:

Keeping a consistency between the various kinds of blocks.
By seeing the parent and child block within.
By adding some color to each kind of block type.
Making all block labels clickable.
Click a parent block, reusable block etc etc and see the default settings for it in the right sidebar.

Ideas for Global Block Settings
#1224

[paaljoachim]

Here is a similar trac issue: https://core.trac.wordpress.org/ticket/45575

It is important that all blocks should have a clear border to define the space they are in.

[mario-neuhold]

I like the idea of different colors / border styles!
And I would suggest to make a toggle option to show these borders permanently via the options panel, just like "Top Toolbar". Not sure if default on/off would be better, since it kinda interfers with the visual expectation of the live result. Thinking of something like this:

[mapk]

I believe the inner blocks are being explored in #14961 and #15537. With these changes, a lot of confusion should be resolved.

I'm also not too keen on differentiating based solely on color because there could be a11y issues there.

What I do like about this issue is the concept of making the block labels clickable as in a breadcrumb system. Although the labels have changed design since this issue was created. In addition, with the advent of a new Document Outline, this too may prove to be unnecessary.

I'm going to close this since it's being solved in a variety of ways in other PRs right now. Thanks @paaljoachim for the suggestions.