There's already a full implementation here: http://www.polymer-project.org/docs/elements/paper-elements....
Yes, but AFAIK it's polymer-specific
Google Material design framework
11–20 of 21 posts
Re: Google Material design framework
#12This isn't really material, but more of a "I've copied the colors and misused them." A huge part of material is animations and behaviors and this doesn't have it. Simplest example is buttons. Go to http://www.google.com/design/ and over over the more button (or anything else that's clickable). You'll see it elevate a bit as if to come up and meet your cursor. Compare that to the buttons from the toolkit.
I agree. But you gotta start somewhere. The first step is to just recreate the components. Feel free to contribute with your ideas and add some neat CSS3 animations to the framework.
Have you looked into the polymer elements http://www.polymer-project.org/docs/elements/? I'm not sure if it would be against the license, but in principle they have a complete implementation of the material design that could be extracted as a separate css-only framework.
Re: Google Material design framework
#13Re: Google Material design framework
#14I'm so meh about this.
Re: Google Material design framework
#15Earlier quoted context omitted.
Yes, but AFAIK it's polymer-specific
Not really, all the css stylesheets are there and could easily be extracted.
Material design is more than just the colors, shadows and spacing, its also the animations and interactions.
This CSS framework fails to replicate things like "ink" that fills an element with a tap color based on where in that element you tapped.
Or the way that a block of color slides across the input when you focus it and the placeholder slides up and scales down to turn into a label.
Material design is not a CSS theme, it requires many other interaction and animation aspects that the Polymer project is building out with their paper-* components.
Re: Google Material design framework
#16Earlier quoted context omitted.
Yes, but AFAIK it's polymer-specific
Not really, all the css stylesheets are there and could easily be extracted.
Their implementation does not only consist of CSS - there is canvas, shadow DOM, and other areas that are all heavily intertwined with Polymer, which would make extracting it difficult and complex.
Re: Google Material design framework
#17Earlier quoted context omitted.
Not really, all the css stylesheets are there and could easily be extracted.
Material design is more than just the colors, shadows and spacing, its also the animations and interactions. This CSS framework fails to replicate things like "ink" that fills an element with a tap color based on where in that element you tapped. Or the way that a block of color slides across the input when you focus it and the placeholder slides up and scales down to turn into a label. Material design is not a CSS t…
I'm aware of that, all I was saying is that hypothetically it would be possible to dismember the polymer components in separate pieces of javascript / css / html and replicate the behaviour in this way. I'm not sure why someone would want to do that, but just studying the implementation might be interesting to someone new. The paper-components seem very well designed.
In any case it does make way more sense than trying to replicate the design on your own and reinvent the wheel. Especially since there is nothing particularly creative in copying the design of someone else.
Re: Google Material design framework
#18Would be cool to have all Metro/ios/Google design styles merged to one Bootstrap theme and then just on some LESS or JS I could switch view to different device.
Came here to say that. In fact I was searching right when Material was announced.
Re: Google Material design framework
#19Earlier quoted context omitted.
I agree. But you gotta start somewhere. The first step is to just recreate the components. Feel free to contribute with your ideas and add some neat CSS3 animations to the framework.
Have you looked into the polymer elements http://www.polymer-project.org/docs/elements/ ? I'm not sure if it would be against the license, but in principle they have a complete implementation of the material design that could be extracted as a separate css-only framework.
Polymer is licensed under BSD so it shouldn't be hard at all to do that and comply.
Re: Google Material design framework
#20There's already a full implementation here: http://www.polymer-project.org/docs/elements/paper-elements....
Yes, but AFAIK it's polymer-specific
Yes, they're implemented with Polymer, but that does not mean they're "Polymer specific". You can use them in any HTML page - just import the element, and use it. This is the promise of web components.