<template>
  <!-- eslint-disable vue/no-v-html -->
  <div class="instrument-widget">
    <div
      class="instrument-widget__description"
      v-html="value.description"
    />
    <router-link
      :to="{name: 'instrument', params: { slug: value.slug }}"
      class="instrument-widget__button button"
    >
      {{ $flavor.textInstrument }} anzeigen
    </router-link>
  </div>
</template>

<script>
  export default {
    props: ['value'],
  };
</script>

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

  .instrument-widget {
    margin-bottom: $small-spacing;

    &__description {
      margin-bottom: 25px;
    }

    &__button {

    }
  }
</style>
