As most of you know, you can style many things in Perspective based on the element state (based on CSS pseudo-classes, I’m guessing). For example, a label can have default style when displayed and another style when it is hovered over. The way to do that in Perspective now is to use Style Classes or to add custom CSS, either in a theme or additional files.
Is there a reason why we can’t add element state style declarations straight on the component props? Is this to discourage bad practices or is there a technical reason that makes it impractical?
The reason I’m asking is because, though style classes are a great idea in traditional web development, the implementation in Perspective is quite clunky, at best. The additional effort of having to remember and find Style classes I previously created to do something simple like underline a label’s text on hover is not worth it for me. I may be an anomaly, but I know most of my coworkers never use them either.
I believe this is because styles applied in the component props are written directly into the html. Pseudo-classes can only be applied to CSS selectors and so are not valid within/as HTML elements.
Of course you can work around some of this by using events and modifying the style props on the fly. Utilizing style classes and/or themes are much cleaner IMHO.
Ahh… This is definitely it. Any styles that are defined in
props.style are added as inline CSS in the markup. Pseudo-selectors and pseudo-elements are an abstraction of the DOM (based on this).
We have a pending ticket to make a more ‘intermediate’ style CSS declaration resource; a project-local raw CSS file. No limitations of style classes; less global than themes; less advanced than themes.
That would be S W E E T. Seriously, this is something I would use every time I use the designer. Is there a timeline for this ticket?
No, no timeline. Technically it hasn’t even been accepted yet as a feature we’ll do; it’s something I proposed that is sitting in the rather formidable list of possible Perspective bugs & features.