Material Design Lite Components in HTML/CSS/JS

#1

Post by vladikoff » Mon, Jul 06, 2015, 5:24 PM UTC

Material Design Lite Components in HTML/CSS/JS
github.com

Re: Material Design Lite Components in HTML/CSS/JS

#2

Post by paulirish » Mon, Jul 06, 2015, 5:52 PM UTC

Full site here: http://getmdl.io

Re: Material Design Lite Components in HTML/CSS/JS

#3

Post by spoiler » Mon, Jul 06, 2015, 6:03 PM UTC

I love this! I've been meaning to make something like this myself for a project; now I won't have to.

I have to point out some flaws, though; for example the side menu here[1] has very low text contrast once you hove over them.

[1]: http://www.getmdl.io/templates/dashboard/index.html

Re: Material Design Lite Components in HTML/CSS/JS

#4

Post by Zikes » Mon, Jul 06, 2015, 6:17 PM UTC

spoiler wrote: post #3

I love this! I've been meaning to make something like this myself for a project; now I won't have to. I have to point out some flaws, though; for example the side menu here[1] has very low text contrast once you hove over them. [1]: http://www.getmdl.io/templates/dashboard/index.html

I think that's worth filing an issue for.

Re: Material Design Lite Components in HTML/CSS/JS

#5

Post by Aldo_MX » Mon, Jul 06, 2015, 6:20 PM UTC

I loved that in contrast with the other Material Design Toolkits, this one uses only CSS for its animations.

Re: Material Design Lite Components in HTML/CSS/JS

#6

Post by marcacohen » Mon, Jul 06, 2015, 6:20 PM UTC

paulirish wrote: post #2

Full site here: http://getmdl.io

and article with nice overview here: https://medium.com/google-developers/introducing-material-de...

Re: Material Design Lite Components in HTML/CSS/JS

#7

Post by asurma » Mon, Jul 06, 2015, 6:21 PM UTC

Zikes wrote: post #4

spoiler wrote: post #3

I love this! I've been meaning to make something like this myself for a project; now I won't have to. I have to point out some flaws, though; for example the side menu here[1] has very low text contrast once you hove over them. [1]: http://www.getmdl.io/templates/dashboard/index.html

I think that's worth filing an issue for.

https://github.com/google/material-design-lite/issues/739

Re: Material Design Lite Components in HTML/CSS/JS

#8

Post by addy_osmani » Mon, Jul 06, 2015, 6:28 PM UTC

spoiler wrote: post #3

I love this! I've been meaning to make something like this myself for a project; now I won't have to. I have to point out some flaws, though; for example the side menu here[1] has very low text contrast once you hove over them. [1]: http://www.getmdl.io/templates/dashboard/index.html

Lead for MDL here. Glad you like the idea, spoiler :) Thanks for catching the low contrast issue with the dashboard navigation - is it the same as https://github.com/google/material-design-lite/issues/739?. If not, would you mind filing an issue on the repo and we'll try to get that fixed up soon?

https://github.com/google/material-design-lite/blob/master/C...

Alternatively, we can file a bug for you if you share details about the browser/os/device you were testing on.

Re: Material Design Lite Components in HTML/CSS/JS

#9

Post by TheSisb2 » Mon, Jul 06, 2015, 6:28 PM UTC

I love the design, but I'm finding a lot of the animations aren't smooth. I'm on Chrome 43.

Re: Material Design Lite Components in HTML/CSS/JS

#10

Post by addy_osmani » Mon, Jul 06, 2015, 6:29 PM UTC

asurma wrote: post #7

Zikes wrote: post #4

Earlier quoted context omitted.

I think that's worth filing an issue for.

https://github.com/google/material-design-lite/issues/739

Just assigned that issue. We'll try to get it fixed up soon.