On 1/14/17, 10:56 PM, "omup...@gmail.com on behalf of OmPrakash Muppirala" <omup...@gmail.com on behalf of bigosma...@gmail.com> wrote:
>Thinking about this more, we could enclose components in a container div. >The component would have the frozen styles and any classnames the user >sets >would would be on the parent div. This way, due to the cascading nature >of >CSS, the component would get the appropriate styles while maintaining the >frozen styles. > >For example, in FontAwesome, the current implementation is: > ><fa:FontAwesomeIcon iconType="fa-twitter"> >becomes ><i class="fa fa-twitter">character_code</i> > >If user sets a classname property in mxml: > ><fa:FontAwesomeIcon iconType="fa-twitter" className="myColor"> >becomes ><i class="myColor">character_code</i> > >unless we do a lot of internal class name maintenance. > >Instead, if we have the implementation as: > ><div> > <i class="fa fa-twitter">character_code</i> ></div> > >Setting a class name could be done this way: > ><div class="myColor"> > <i class="fa fa-twitter">character_code</i> ></div> > >The <i> element would still inherit the myColor class and the component >will not get modified externally. > >The only drawback is an additional <div> but I think that is acceptable. > >Thoughts? I would not want to see Basic components wrapped in divs. The MDL and FA set can do that if they want. I guess I still don't understand why my recommendation of an internal list like "typeNames" and "user" list like className won't work. What am I missing? One thing I want to point people to when considering FlexJS is that the DOM looks like it would if you coded it without FlexJS. That makes us compare better than having extra divs everywhere. I would also think where folks use non-inheriting styles it wouldn't work that well? And would divs mess up some kinds of advanced CSS like sibling selectors? Of course, I could be wrong... -Alex