Add play icon to topic page
This commit is contained in:
parent
d36bbafb04
commit
4a834b8140
|
|
@ -0,0 +1,5 @@
|
|||
<template>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
|
||||
<path d="M50,0a50,50,0,1,0,50,50A50,50,0,0,0,50,0ZM38,74V26L70,50Z" style="fill:#17a887"/>
|
||||
</svg>
|
||||
</template>
|
||||
|
|
@ -5,6 +5,7 @@
|
|||
{{topic.teaser}}
|
||||
</p>
|
||||
<div v-if="topic.vimeoId" class="topic__video-link" @click="openVideo">
|
||||
<play class="topic__video-link-icon"></play>
|
||||
<span class="topic__video-link-description">Video schauen</span>
|
||||
</div>
|
||||
<div class="topic__modules">
|
||||
|
|
@ -15,11 +16,13 @@
|
|||
|
||||
<script>
|
||||
import ModuleTeaser from '@/components/modules/ModuleTeaser.vue';
|
||||
import Play from '@/components/icons/Play';
|
||||
import TOPIC_QUERY from '@/graphql/gql/topicQuery.gql';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ModuleTeaser
|
||||
ModuleTeaser,
|
||||
Play
|
||||
},
|
||||
|
||||
apollo: {
|
||||
|
|
@ -75,6 +78,13 @@
|
|||
&__video-link {
|
||||
margin-bottom: $large-spacing;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&__video-link-icon {
|
||||
width: 40px;
|
||||
margin-right: $medium-spacing;
|
||||
}
|
||||
|
||||
&__video-link-description {
|
||||
|
|
|
|||
Loading…
Reference in New Issue