ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Add icon to tasks

This commit is contained in:
Ramon Wenger 2018-08-27 16:45:08 +02:00
parent 0a6cd1b258
commit 333f68b04d
2 changed files with 28 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/src/components/content-blocks/Task.vue
View File

@ -1,17 +1,35 @@
<template> <template>
<div class="task" v-html="value.text"></div> <div class="task">
<chevron-right class="task__icon"></chevron-right>
<div class="task__text" v-html="value.text"></div>
</div>
</template> </template>
<script> <script>
import ChevronRight from '@/components/images/ChevronRight.vue';
export default { export default {
props: ['value'] props: ['value'],
components: {
ChevronRight
}
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.task { @import "@/styles/_variables.scss";
padding-left: 30px;
.task {
display: grid;
grid-template-columns: 45px 1fr;
margin-bottom: 30px; margin-bottom: 30px;
align-items: start;
&__icon {
width: 20px;
padding-top: 4px;
fill: $color-brand;
}
} }
</style> </style>

6
client/src/components/images/ChevronRight.vue Normal file
View File

@ -0,0 +1,6 @@
<template>
<svg id="shape" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>
arrow-right</title>
<path d="M74.07,50,30.93,93.14A2.93,2.93,0,0,1,26.79,89l39-39-39-39a2.93,2.93,0,0,1,4.15-4.15Z"/>
</svg>
</template>