Performant Ripple Effect For Vue

Install & Download:

Description:

Material Design inspired performant ripple click effect for Vue.js and Vanilla JS.

How to use it:

1. Import the Ripple component.

import Ripple from 'fi-ripple';
2. Use it as a Vue directive.

export default {
  directives: {
    Ripple,
  },
}

<button v-ripple>Click me</button>

3. Use it as a Vanilla JS component.

const rippleContainer = document.getElementById('myButton');
new FiRipple(rippleContainer);

Preview:

Changelog:

01/13/2022

• v0.1.8