100 lines
2.4 KiB
Vue
100 lines
2.4 KiB
Vue
<template>
|
|
<div class="project">
|
|
<div class="project__header">
|
|
<h1 class="project__title">Quartalsarbeit: Mein Lehrbetrieb</h1>
|
|
<p class="project__description">
|
|
Das ist eine Beschreibung und kann maximal 200 Zeichen enthalten. Das ist eine Beschreibung und kann maximal 200
|
|
Zeichen enthalten. Das ist eine Beschreibung und kann maximal 200 Zeichen enthalten.
|
|
</p>
|
|
|
|
<h2 class="project__objectives-title">Ziele</h2>
|
|
<ul class="project__objectives">
|
|
<li class="project__objective">Ich kann ein Interview mit geeigneten Fragen vorbereiten.</li>
|
|
<li class="project__objective">Ich kann ein Interview führen und auf interessante oder ausweichende
|
|
Antworten näher eingehen.
|
|
</li>
|
|
<li class="project__objective">Ich kann ein mündlich geführtes Interview in Standardsprache
|
|
aufzeichnen.
|
|
</li>
|
|
</ul>
|
|
|
|
</div>
|
|
<div class="project__content">
|
|
<add-project-entry class="project__add-entry"></add-project-entry>
|
|
<project-entry></project-entry>
|
|
<project-entry></project-entry>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import ProjectEntry from '@/components/portfolio/ProjectEntry';
|
|
import AddProjectEntry from '@/components/portfolio/AddProjectEntry';
|
|
|
|
export default {
|
|
|
|
components: {
|
|
AddProjectEntry,
|
|
ProjectEntry
|
|
},
|
|
|
|
created() {
|
|
this.$store.dispatch('setSpecialContainerClass', 'red');
|
|
},
|
|
|
|
beforeDestroy() {
|
|
this.$store.dispatch('setSpecialContainerClass', '');
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "@/styles/_variables.scss";
|
|
@import "@/styles/_functions.scss";
|
|
|
|
.project {
|
|
margin-bottom: -50px;
|
|
|
|
&__header {
|
|
padding: 30px;
|
|
}
|
|
|
|
&__add-entry {
|
|
height: 120px;
|
|
}
|
|
|
|
&__description,
|
|
&__objective {
|
|
font-family: $sans-serif-font-family;
|
|
}
|
|
|
|
&__description {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
&__objectives-title {
|
|
font-size: toRem(22px);
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
&__objectives {
|
|
list-style: disc;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
&__objective {
|
|
line-height: 1.5;
|
|
}
|
|
|
|
&__content {
|
|
background-color: $color-grey--lighter;
|
|
display: grid;
|
|
grid-template-columns: 840px;
|
|
grid-row-gap: 30px;
|
|
justify-content: center;
|
|
padding-top: 30px;
|
|
padding-bottom: 50px;
|
|
}
|
|
}
|
|
</style>
|