Ripples on large elements are too slow and overlap until element turns black

[andrewseguin]

Bug, feature request, or proposal:

Ripple looks AMAZING on small elements such as buttons. But when applied to a larger element, the ripple crawls along the element. Additionally, if clicked many times, the ripples overlap so much that the element turns black.

What is the expected behavior?

Ripples have the same perceived speed regardless of the element size. When clicked multiple times, the oldest ripples fade out quicker so they don't overlap.

What is the current behavior?

Ripples are slow on large elements and overlap a lot.

What are the steps to reproduce?

See this example for different ripple use cases: http://plnkr.co/edit/Xk6hkgGyGIaaKTnZb493?p=preview

What is the use-case or motivation for changing an existing behavior?

Match closer to spec

Which versions of Angular, Material, OS, browsers are affected?

Master

[andrewseguin]

To compare to Material 1, here's a codepen containin a single large button: http://codepen.io/anon/pen/XpGydW

[devversion]

Cool thanks for the issue. I will look into it!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}