Create ripple effect from Material Design with React
npm install react-touch-ripplebash
npm install react-touch-ripple --save
`
Usage
$3
`jsx
import Ripples from 'react-touch-ripples';
const Demo = () => (
);
ReactDOM.render(
`
$3
A quick note here: is a box wrapping around its child component (in this case,
$3
The background-color of the ripples are default to currentColor. If you are to change it, pass it as a prop to .
`jsx
const ColoredDemo = () => (
);
`
An important note: opacity: 0.3 is already set on the ripples. So you just need to pass in the color without an alpha.
`jsx
`
This is UNNESSARY and will behave out of your expectation.
$3
Provide center property on the will center every ripple it created. This is usually useful when you are applying ripples on a switch or checkbox component. See demos for more information.
`jsx
const RippleSwitch = () => (
);
``