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

Remove unnecessary component

This commit is contained in:
Ramon Wenger 2019-03-07 11:33:57 +01:00
parent a233c02049
commit 658acd2ed7
2 changed files with 50 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
client/src/components/portfolio/Portfolio.vue
View File

@ -1,76 +0,0 @@
<template>
<div class="portfolio">
<add-project></add-project>
<project-widget
v-for="project in projects"
v-bind="project" :key="project.id"
class="portfolio__project"
></project-widget>
</div>
</template>
<script>
import ProjectWidget from '@/components/portfolio/ProjectWidget';
import AddProject from '@/components/portfolio/AddProject';
import PROJECTS_QUERY from '@/graphql/gql/allProjects.gql';
export default {
components: {
ProjectWidget,
AddProject
},
apollo: {
projects: {
query: PROJECTS_QUERY,
update(data) {
return this.$getRidOfEdges(data).projects
}
},
},
data() {
return {
projects: [
{
id: 1,
title: 'Quartalsarbeit: Mein Lehrbetrieb',
appearance: 'green',
slug: 'quartalsarbeit'
},
{
id: 2,
title: 'Mein Projekt 2',
appearance: 'red',
slug: 'mein-projekt-2'
},
{
id: 3,
title: 'Mein Projekt 3',
appearance: 'blue',
slug: 'mein-projekt-3'
},
]
}
}
}
</script>
<style scoped lang="scss">
.portfolio {
display: -ms-grid;
@supports (display: grid) {
display: grid;
}
grid-row-gap: 30px;
grid-auto-rows: 200px;
width: 640px;
justify-self: center;
box-sizing: border-box;
}
</style>

59
client/src/pages/portfolio.vue
View File

@ -1,23 +1,64 @@
<template> <template>
<div class="portfolio-page"> <div class="portfolio__page">
<portfolio></portfolio> <div class="portfolio">
<add-project></add-project>
<project-widget
v-for="project in projects"
v-bind="project" :key="project.id"
class="portfolio__project"
></project-widget>
</div>
</div> </div>
</template> </template>
<script> <script>
import Portfolio from '@/components/portfolio/Portfolio'; import ProjectWidget from '@/components/portfolio/ProjectWidget';
import AddProject from '@/components/portfolio/AddProject';
import PROJECTS_QUERY from '@/graphql/gql/allProjects.gql';
export default { export default {
components: { components: {
Portfolio ProjectWidget,
AddProject
},
apollo: {
projects: {
query: PROJECTS_QUERY,
update(data) {
return this.$getRidOfEdges(data).projects
}
},
},
data() {
return {
projects: []
}
} }
} }
</script> </script>
<style> <style scoped lang="scss">
.portfolio-page { .portfolio {
display: grid; display: -ms-grid;
align-content: center; @supports (display: grid) {
justify-content: center; display: grid;
}
grid-row-gap: 30px;
grid-auto-rows: 200px;
width: 640px;
justify-self: center;
box-sizing: border-box;
&__page {
display: grid;
align-content: center;
justify-content: center;
}
} }
</style> </style>