CSS pseudo-classes support through OOTB skin rule


I want to know if css pseudo-classes (like on hover  on disabled  on check / uncheck change the css style on fly) is supported through OOTB Pega Skin rule without writing custom css. Our client gives multiple UI requirements where css pseudo-classes are needed to change style of certain elements on the fly if events click on click / hover happens. We are using Pega 7.2.1.

Thanks a lot !

Kind Regards,


Keep up to date on this post and subscribe to comments

December 4, 2019 - 12:54pm

This is supported through the skin for different components without needing to write custom CSS. However, sometimes it is not always so clear.

For example, for link controls it is pretty clear we generate and support this.

But then for something like a tab layout, it is not readily apparent from the skin that this will happen, but it does under the hood. For example, here I am hovering manually and see the defined border. In this case it appears both active and hover states will be shared for this component, whereas the link control has a more clear separation.

Now to test this out without the mouse, you can see here that when I toggle the hover state using the dev tools, you see the same effect.