A highly customizable Vue.js component for sharing links on social networks

# Yarn 
yarn add vue-share-it

# NPM 
npm install vue-share-it --save

import shareIt from 'vue-share-it';

Vue.use(shareIt);

<script src="https://unpkg.com/vue-share-it@x.x.x/dist/vue-share-it.js"></script>

<share-it />

<share-it text="This is sample text" url="https://www.google.com" :height="600" :width="600" />

<share-it :targets="['twitter', 'facebook']" />

<share-it dark />

<share-it dense />

<share-it outline />

const share = {
  twitter: {
    size: "2x",
    label: "Custom label!",
    round: true,
  },
  linkedin: {
    size: "2x",
    color: "#333",
    backgroundColor: "yellow",
  },
  facebook: {
    size: "3x",
    dark: true
  },
  whatsapp: {
    size: "2x",
    dense: true,
    outline: true,
    color: 'green',
  },
}

<share-it :shareConfig="share" />

<share-it icons />

<share-it icons outline />

<share-it icons outline round />

const iconConfig ={
  twitter: {
    icon: true,
    size: "sm",
    color: "#333",
    round: true,
    backgroundColor: 'yellow'
  },
  linkedin: {
    icon: true,
    size: "lg",
    outline: true,
    round: true,
    
  },
  facebook: {
    icon: true,
    size: "2x",
    outline: true,
    round: true
  },
  whatsapp: {
    icon: true,
    size: "3x",
    outline: true,
    round: true
  },
  reddit: {
    icon: true,
    size: "4x",
    outline: true,
    round: true
  },
}

<share-it :shareConfig="iconConfig" />

<share-it>
  <template v-slot:twitter-icon>
    <v-icon>mdi-twitter</v-icon>
  </template>
  <template v-slot:twitter-label>
    <em>Tweet it!</em>
  </template>
  <template v-slot:whatsapp-icon>
    <v-icon>mdi-whatsapp</v-icon>
  </template>
  <template v-slot:whatsapp-label>
    <em>Share on Whatsapp</em>
  </template>
</share-it>