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

Visually add "Add Content" button

This commit is contained in:
Unknown 2018-09-03 18:56:13 +02:00
parent c07be5d4a4
commit 97006dead5
3 changed files with 45 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
client/src/components/AddContent.vue Normal file
View File

@ -0,0 +1,30 @@
<template>
<div class="add-content">
<add-pointer class="add-content__icon"></add-pointer>
</div>
</template>
<script>
import AddPointer from '@/components/images/AddPointer';
export default {
components: {
AddPointer
}
}
</script>
<style scoped lang="scss">
@import "@/styles/_variables.scss";
.add-content {
display: flex;
justify-content: flex-end;
&__icon {
height: 57px;
margin-right: -85px;
fill: $color-grey;
}
}
</style>

18
client/src/components/ContentBlock.vue
View File

@ -1,11 +1,16 @@
<template>
<div class="content-block" :class="specialClass">
<h4>{{contentBlock.title}}</h4>
<div>
<add-content></add-content>
<component v-for="component in contentBlock.contents" :key="component.id" :is="component.type"
v-bind="component"></component>
<div class="content-block" :class="specialClass">
<h4>{{contentBlock.title}}</h4>
<component v-for="component in contentBlock.contents" :key="component.id" :is="component.type"
v-bind="component"></component>
</div>
</div>
</template>
<script>
@ -14,17 +19,18 @@
import Task from '@/components/content-blocks/Task.vue';
import ImageBlock from '@/components/content-blocks/ImageBlock.vue';
import StudentEntry from '@/components/content-blocks/StudentEntry.vue';
import AddContent from '@/components/AddContent';
export default {
props: ['contentBlock'],
components: {
'text_block': TextBlock,
// todo: rename in backend
'basic_knowledge': BasicKnowledgeWidget,
'student_entry': StudentEntry,
'image_block': ImageBlock,
Task
Task,
AddContent
},
computed: {

7
client/src/components/images/AddPointer.vue
View File

@ -1,8 +1,7 @@
<template>
<svg id="shape" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><title>
add-pointer</title>
<svg id="shape" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path
d="M70.26,20.26A29.77,29.77,0,0,0,40.59,48H2a2,2,0,1,0,0,4h38.6A29.74,29.74,0,1,0,70.26,20.26Zm0,55.5A25.76,25.76,0,1,1,96,50,25.78,25.78,0,0,1,70.26,75.76Z"/>
<path d="M82.24,48h-10V38a2,2,0,0,0-4,0V48h-10a2,2,0,1,0,0,4h10V62a2,2,0,0,0,4,0V52h10a2,2,0,1,0,0-4Z"/>
d="M70.26 20.26A29.77 29.77 0 0 0 40.59 48H2a2 2 0 1 0 0 4h38.6a29.74 29.74 0 1 0 29.66-31.74zm0 55.5A25.76 25.76 0 1 1 96 50a25.78 25.78 0 0 1-25.74 25.76z"/>
<path d="M82.24 48h-10V38a2 2 0 0 0-4 0v10h-10a2 2 0 1 0 0 4h10v10a2 2 0 0 0 4 0V52h10a2 2 0 1 0 0-4z"/>
</svg>
</template>