add new components with dummy data

This commit is contained in:
Christian Cueni 2019-04-10 15:50:14 +02:00
parent 42c579b047
commit f51924330c
5 changed files with 143 additions and 7 deletions

View File

@ -0,0 +1,88 @@
<template>
<div class="module-activity">
<h3 class="module-activity__module-name">Geld und Kauf - Modul 9</h3>
<h2 class="module-activity__title">Ökololololologie</h2>
<div class="module-activity__tasks activity-tasks">
<h4 class="activity-tasks__title">Aufträge</h4>
<ol class="activity-tasks__task-list task-list">
<li class="task-list__item task-item">
<h5 class="task-item__title">Auftrag x, Begründung</h5>
<p class="task-item__submission">"eine Antwrotasdfasdfasdf"</p>
</li>
<li class="task-list__item task-item">
<h5 class="task-item__title">Auftrag x, Begründung</h5>
<p class="task-item__submission">"eine Antwrotasdfasdfasdf"</p>
</li>
<li class="task-list__item task-item">
<h5 class="task-item__title">Auftrag x, Begründung</h5>
<p class="task-item__submission">"eine Antwrotasdfasdfasdf"</p>
</li>
<li class="task-list__item task-item">
<h5 class="task-item__title">Auftrag x, Begründung</h5>
<p class="task-item__submission">"eine Antwrotasdfasdfasdf"</p>
</li>
</ol>
</div>
<div class="module-activity__tasks activity-tasks">
<h4 class="activity-tasks__title activity-tasks__title--alternative">Basiswissen</h4>
<ol class="activity-tasks__task-list task-list">
<li class="task-list__item task-item">
<h5 class="task-item__title">Auftrag x, Begründung</h5>:
<p class="task-item__submission">"eine Antwrotasdfasdfasdf"</p>
</li>
</ol>
</div>
</div>
</template>
<script>
export default {
}
</script>
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_mixins.scss";
.module-activity {
@include widget-shadow;
padding: $medium-spacing;
&__module-name {
@include small-text;
color: $color-grey;
}
}
.activity-tasks {
&__title {
background-color: $color-brand-light;
padding: $small-spacing $medium-spacing;
border-radius: $default-border-radius;
&--alternative {
background-color: $color-accent-1-light;
}
}
}
.task-item {
display: flex;
flex-direction: row;
margin-left: $medium-spacing;
&__title {
&::after {
content: ":"
}
margin-right: $medium-spacing;
}
&__title, &__submission {
line-height: 50px;
height: 50px;
}
}
</style>

View File

@ -0,0 +1,46 @@
<template>
<div class="activity">
<h1 class="activity__header">Meine Aktivität</h1>
<module-activity class="activity"></module-activity>
<module-activity class="activity"></module-activity>
<module-activity class="activity"></module-activity>
</div>
</template>
<script>
import ModuleActivity from '@/components/profile/ModuleActivity';
export default {
components: {
ModuleActivity
},
// apollo: {
// schoolClasses: {
// query: MY_SCHOOL_CLASSES_QUERY,
// update(data) {
// return this.$getRidOfEdges(data).me.schoolClasses
// }
// }
// },
data() {
return {
activities: []
}
},
methods: {
}
}
</script>
<style scoped lang="scss">
@import "@/styles/_variables.scss";
.module-activity {
margin-bottom: $large-spacing;
}
</style>

View File

@ -28,9 +28,6 @@
return {
schoolClasses: []
}
},
methods: {
}
}
</script>

View File

@ -32,13 +32,16 @@
<style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_functions.scss";
@import "@/styles/_mixins.scss";
.profile {
padding: $medium-spacing;
max-width: 640px;
margin: 0 auto;
@media screen and (max-width: 1024px) {
max-width: 640px;
margin: 0 auto;
@include desktop {
max-width: 100%;
margin: 0;
}
&__submenu {

View File

@ -1,5 +1,4 @@
import Vue from 'vue'
import Router from 'vue-router'
// import index from '@/pages/index'
import topic from '@/pages/topic'
import book from '@/pages/book'
@ -21,6 +20,8 @@ import project from '@/pages/project'
import profilePage from '@/pages/profile'
import passwordChange from '@/pages/passwordChange'
import myClasses from '@/pages/myClasses'
import activity from '@/pages/activity'
import Router from 'vue-router'
const routes = [
{path: '/', component: start, meta: {layout: 'blank'}},
@ -75,6 +76,7 @@ const routes = [
children: [
{path: 'password-change', name: 'pw-change', component: passwordChange, meta: {isProfile: true}},
{path: 'myclasses', name: 'my-classes', component: myClasses, meta: {isProfile: true}},
{path: 'activity', name: 'activity', component: activity, meta: {isProfile: true}},
]
},
{path: '*', component: p404}