Very hard to add block to area with stacked layouts, height of clickable area is only 1px

[creativesuspects]

Which Umbraco.Community.BlockPreview version are you using?

5.5.0

Which Umbraco version are you using? For example: 10.4.0 - don't just write v10

17.5.3

Bug summary

It's very hard to get the Add block button to show up for an area when you have stacked layouts, so multiple consecutive layouts. The height of the clickable area for the Add block button is only 1px.

Steps to reproduce

Define a Block Grid with multiple layouts, e.g.:

When trying to add a block in the Content | Sidebar layout directly below the Hero block, the height of the clickable area for the Add block button is only 1px:

1 pixel up and the Add block button disappears, 1px down and the Add block button between the two layouts appears.

The following CSS fixed the problem and enlarges the hoverable/clickable area for this scenario:

.umb-block-grid__layout-item {
    margin-block: var(--uui-size-2);
}

But this may have some unwanted (visual) side effects, because it increases the spacing between layouts.

Expected result / actual result

No response