title: Disable ripple effect on vuetify components globally
body: <p>I'm using <code>vuetify</code> on my application. The design team create a flat design and I want to change the theme of <code>vuetify</code> to match with mockups</p>
  
  <p>I try to find an option to disable ripple effect easily all over the application but it doesn't exist.</p>
  
  <p>I try to create a component extension to avoid repeating <code>:ripple="false"</code>on each component I use.</p>
  
  <p>I'll take a button component as an example.</p>
  
  <pre><code>&lt;v-btn :ripple="false"&gt;My Button&lt;/v-btn&gt;
  </code></pre>
  
  <p>each button on my application need to have <code>ripple=false</code>
  My aim is to create a component like this </p>
  
  <pre><code>&lt;my-button&gt;My Button&lt;/my-button&gt;
  </code></pre>
  
  <p>I try to extend <code>v-btn</code> in another component like this.</p>
  
  <pre><code>&lt;template&gt;
      &lt;v-btn v-bind="options" :ripple="false"&gt;&lt;/v-btn&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
    import { VBtn } from 'vuetify';
  
    export default {
    name: 'MyButton',
    extend: VBtn,
    computed: {
      options() {
        return this.props;
      },
    },
  
  };
  
  &lt;/script&gt;
  
  &lt;style scoped&gt;
  </code></pre>
  
  <p>I try this way to avoid copy/paste all the props of <code>v-btn</code>.</p>
  
  <p>All solutions that I've tried failed.</p>