CODEWITHSUNDEEP
cssreactjsmaterial-designmaterial-ui
aditya
aditya

Reputation: 339

Ripple affect in material ui to fill up the button with a different color

I am using material ui for react. So When the user clicks on the button(from material ui), there is a ripple effect seen, but it fades away soon, I would want that the ripple effect fill up the button with a different color.

Please give suggestions how could this be achieved.

Thanks.

Upvotes: 0

Views: 2491

Answers (1)

hazardous
hazardous

Reputation: 10837

Check the TouchRipple component's code, it's got a prop called color. All material-ui components use the TouchRipple for the ripple effect. Now you want to control the color of this prop for Buttons. Material UI offers several different kinds of buttons. You can follow the code of the button you want to use, you'll notice they use EnhancedButton which then uses TouchRipple. EnhancedButton exposes a prop call touchRippleColor which can be used to specify the color of the ripple effect.

Upvotes: 1

Related Questions