We need a way to distinguish between Disabled and Visibility in the Design Panel

In the Design panel, when you disable a CSS or JS file, it turns to a gray color. When you change the Visibility, it also uses the same exact gray color.

This is confusing.

I’m thinking it would be better if we used the same “eye with a line through it” icon that appears when a component is hidden in the Overview panel to indicate when a component is Disabled in the Design panel.

1 Like

Hmm I would find the eye to be confusing as well then as you’d have no way to know by looking at it, which way it was turned off.

I’d be more inclined to see maybe a diff colored eye? The white one that is there when it’s hidden in the Overview Panel and a blue eye if it’s hidden using the Visibility settings in the Options pane maybe? Some way to distinguish between them would definitely be a good thing for me too.

If it it’s enabled, it would be normal white text, and there would be no eye. If it’s disabled, the text would still be white but the white eye with the slash icon would appear, just as it does when you hide a component in the Overview panel.

Right now, in the Design panel, both disabled items and selectively visible items both turn the same color gray, so there’s no simple way to tell at a glance if something is disabled or just not visible on that page.

My mistake there, I misunderstood the part you were asking to be changed I think? I thought you were talking about the eye in the Overview pane, my bad.

+1 !! I too would love this to be the case as well.

Another thing I would like to see is the ability to add a hidden setting to folders within all sections/directories as well. Then I can also do what I do with the HTML section. If I have files that I want to hide for now, but may use later or parts of later I throw them into a hidden directory which they then become hidden with it automatically.

Thank you for the suggestion! We will add some kind of indicators/icons in our next updates to make it clear why the items are grayed out.