Hiding an element with a condition disappears in Cornerstone editor/previewer

I understand that this expected behavior, but I would love to request that in the Cornerstone editor (only) you simply change the background of the element with a gray striped pattern or something of the like when an element is hidden due to a condition instead of removing the element entirely. That way we can easily see that it is in fact hidden and not just missing, and so we can select the element and edit it and not have to track it down in the tree. We also clone pages and forget about hidden elements sometimes when we can’t see it on the page.

Here is an example of how I do it for a custom class:

.hide {
  display: none;
}

.tco-preview .hide {
  display: revert !important;
  background-color: #ccc;
  opacity: 0.8;
  background: repeating-linear-gradient( -45deg, #b1b1b4, #b1b1b4 5px, #ccc 5px, #ccc 25px );
}

And this is how it looks in the editor/previewer when I give it the hide class:

Hello @tkulow,

Thank you for the inquiry.

You can set the Preview > Element Conditions to Ignore if you don’t want the elements to disappear when certain conditions are not met. Please check the screenshot below.

Let us know if you need more info.

Best regards,
Themeco

Thank you. That does help, but when you ignore them, it just looks like there is no condition set on them. If you added a class to the element that indicated that the condition is met somehow, then I could target it and add my own background to it.

Unfortunately, there is no special class added to the element when conditions are assigned to it. You may need to rely on the preview option for this. We’ll forward your request to our channel.

1 Like