{"repo":"justintaddei/v-wave","free":true,"listed":false,"github":"https://github.com/justintaddei/v-wave","clone":"git clone https://github.com/justintaddei/v-wave.git","description":"The material-ripple directive for Vue that actually works","language":"TypeScript","stars":413,"topics":["vue","material-design","microinteractions","micro-interactions","nuxtjs","vuejs"],"license":"MIT","category":"ui-components","readme_excerpt":"v-wave The material-ripple directive for Vue that actually works Also available for React: use-wave Why did I make this? Because every ripple plugin I've tried to use in the past either didn't work or was missing basic features. Here's what you can expect from this plugin: - It works (see for yourself). - The wave appears on pointerdown instead of pointerup (you might think that's an obvious choice... but you'd be wrong). - The wave responds to keyboard events on keyboard-accessible elements (i.e. Enter and Space on ). - There is a small delay before the ripple appears, during which the animation will be canceled if the user moves the pointer (e.g. scrolling on a mobile phone). This is similar to how native Android ripples work. - Uses CSS transforms instead of width and height . - Doesn't affect the appearance of the element you apply it to (won't explode when used on an element with display: flex ). - Guesses the color of the wave automatically by default (using currentColor ). - Works with fixed, absolute, relative, and statically positioned elements. - Will handle independent border-radii (e.g. border-radius: 5px 20px 15px 30px ) perfectly fine. [[Live Demo]](https://justintaddei.github.io/v-wave) Quick start After installing and registering the plugin, this is all you need to get started: Out of the box, this will provide you with a ripple that matches the text color of the element it has been applied to, with reasonable defaults for a responsive feeling ripple. You can ","default_branch":null,"files":null,"tree":[],"storefront":"/r/justintaddei","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/justintaddei/v-wave/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}