<template>
  <div class="icon-root">
    <SvgSprite
      :src="icon"
      :style="style"
    />
    <span>
      {{icon}}
    </span>
  </div>
</template>

<script>
import SvgSprite from '../../src/components/SvgSprite'

export default {
  components: {
    SvgSprite,
  },

  props: {
    icon: String,
    size: String,
  },

  computed: {
    style() {
      return {
        width: this.size,
        height: this.size,
      }
    },
  },
}
</script>

<style scoped>
  .icon-root {
    font-family: Muli, sans-serif;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
</style>
