add new components with dummy data
This commit is contained in:
parent
42c579b047
commit
f51924330c
|
|
@ -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>
|
||||
|
|
@ -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>
|
||||
|
|
@ -28,9 +28,6 @@
|
|||
return {
|
||||
schoolClasses: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -32,13 +32,16 @@
|
|||
<style scoped lang="scss">
|
||||
@import "@/styles/_variables.scss";
|
||||
@import "@/styles/_functions.scss";
|
||||
@import "@/styles/_mixins.scss";
|
||||
|
||||
.profile {
|
||||
padding: $medium-spacing;
|
||||
|
||||
@media screen and (max-width: 1024px) {
|
||||
max-width: 640px;
|
||||
margin: 0 auto;
|
||||
|
||||
@include desktop {
|
||||
max-width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__submenu {
|
||||
|
|
|
|||
|
|
@ -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}
|
||||
|
|
|
|||
Loading…
Reference in New Issue