Hi there.
I think the empty areas CSS is a bit overwhelming and I want it to be more of a user friendly experience. Having a fixed height of 130px and a bright colour breaks elements up like the footer, for example, if the singleton or area is empty. I have found the user.less file, but my changes get overwritten during compilation. There’s nothing wrong with the way they look really, but in editing view it makes my site break up quite a bit. The empty areas even cover the elements they’re supposed to be for (imagine a carousel or footer split in half by an empty area style)
Any ideas? It’s the public, modules, apostrophe-areas style sheet. Of course the empty area goes with content, but it’s more of a gripe in my case.
.apos-area-widget.ui-draggable-dragging { z-index: @apos-z-index-9; }
&.apos-empty
{
// When there aren't any widgets in an area, it should have a height
// and a background color set by default.
height: 130px;
background-color: @apos-light;