<template>
  <router-link :to="link" tag="div" class="add-widget">
    <add-icon class="add-widget__add"></add-icon>
  </router-link>
</template>

<script>
  import AddIcon from '@/components/icons/AddIcon.vue';

  export default {
    props: ['link'],

    components: {
      AddIcon
    }
  }
</script>

<style scoped lang="scss">
  @import "@/styles/_variables.scss";
  @import "@/styles/_mixins.scss";

  .add-widget {
    display: flex;
    align-items: center;
    justify-content: center;
    @include widget-shadow;
    cursor: pointer;

    &__add {
      width: 80px;
      fill: $color-grey;
    }
  }
</style>
