core-style is simply awsome

[Chris Gallo]

Steve, the core-style demo is really nice...I sat there staring at it for a while letting it sink in. I was thinking along the same lines, that there's a missing link between shadow styling and declarative reusability, but hadn't gotten far with it. This approach potentially eliminates the sass build step among other things, which is great. Hopefully the performance is reasonable, I guess we'll have to see on that front. Personally I don't care, I want to start using it and see how it performs. 

What I'd like to do is create a set of components separate from the the themes themselves, based on some common ui frameworks , and then create separate theme repo's for the actual theme (i.e. bootstrap, foundation, ionic, etc.). It seems like the conventions with most frameworks are similar enough that we could pretty much use one set of base components to capture most of their personality, letting their individuality reside in the theme files/repos. 

As far as naming goes, I'm thinking of naming things with a 'cs' prefix, for core-style. 

So for simple stuff, I'm thinking: cs-button, cs-panel, cs-label, cs-listgroup, cs-table etc. basically mirroring bootstrap

For more complicated stuff: cs-navbar, cs-menu, cs-menuitem - maybe fork the core-toolbar, core-menuitem etc. and make a core-style version of those

Other more complex stuff: cs-dialog, will basically leverage core-overlay

forms: cs-textbox, cs-checkbox, etc....I find this to be more expressive than generic inputs everywhere

reset/normalize, typeface, and variables core-styles too, part of the theme.

Does this sound reasonable?

[Rob Dodson]

That sounds like a plan to me. I especially like that you're composing things like core-overlay into more complex structures :)

[Chris Gallo]

Thanks Rob, I'll keep you guys posted on progress/questions

[Pascal Precht]

Hey Chris!

Interesting thoughts. I started working on kind of "porting" Ionic components to web components. I start with the button element, which comes with several themes. However, I didn't came really far because there are many things that make it hard to get a nice development flow (e.g. Ionic uses sass, which doesn't work nice with <core-style>). So, I wonder how far you are in terms of developing components for common UI frameworks. Maybe we can join forces?

[Chris Gallo]

Hi Pascal, sorry for the delay...so I'm making progress; I started out porting bootstrap by hand, but that was way too tedious, so I wrote a little script to convert .less files to a core-style friendly format. Basically the approach I'm taking at this point is to convert the less variables (@line-height, etc) into polymer expressions ({{ g.theme.lineHeight }}). From there I'm letting less do the heavy lifting and not attempting to convert the mixins just yet. Mixins could easily be modeled with templates though, bound to an object declared in the 'bind' attribute. But right now I just want to get something going. 

I'll put my conversion script up on github when its a little more fleshed out, it could probably be re-tooled pretty easily for sass stuff. So thats where I'm at right now, hopefully I'll have a working subset of boostrap pretty soon...It's pretty daunting going over all that css, I'm sure there's plenty of stuff that could be removed for polymer's purposes, but I'll leave that for later. 

[Pascal Precht]

Hey that sounds great :) Please update this thread, once you have something online :)