42 lines
865 B
Vue
42 lines
865 B
Vue
<template>
|
|
<router-link tag="div" :to="{name: 'instrument', params: {slug: slug}}" class="instrument-teaser">
|
|
<h3 class="instrument-teaser__title">{{title}}</h3>
|
|
<p class="instrument-teaser__text" v-html="teaser">
|
|
</p>
|
|
</router-link>
|
|
</template>
|
|
|
|
<script>
|
|
import teaser from '@/helpers/teaser';
|
|
|
|
export default {
|
|
props: ['title', 'contents', 'slug'],
|
|
|
|
computed: {
|
|
teaser() {
|
|
return teaser(this.contents);
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "@/styles/_variables.scss";
|
|
@import "@/styles/_mixins.scss";
|
|
|
|
.instrument-teaser {
|
|
height: 250px;
|
|
box-sizing: border-box;
|
|
padding: $medium-spacing;
|
|
@include widget-shadow;
|
|
width: 100%;
|
|
cursor: pointer;
|
|
|
|
&__title {
|
|
@include heading-3;
|
|
margin-bottom: $small-spacing;
|
|
line-height: 1.2;
|
|
}
|
|
}
|
|
</style>
|