skillbox/client/src/components/portfolio/AddProjectEntry.vue

48 lines
949 B
Vue

<template>
<a
class="add-project-entry"
@click="addProjectEntry">
<plus-icon class="add-project-entry__icon" />
<span class="add-project-entry__text">Beitrag erfassen</span>
</a>
</template>
<script>
import PlusIcon from '@/components/icons/PlusIcon';
export default {
props: ['project'],
components: {PlusIcon},
methods: {
addProjectEntry() {
this.$store.dispatch('addProjectEntry', this.project);
}
}
};
</script>
<style lang="scss" scoped>
@import "~styles/helpers";
.add-project-entry {
display: flex;
align-items: center;
justify-content: center;
border: 2px solid $color-brand;
border-radius: $default-border-radius;
cursor: pointer;
&__icon {
width: 20px;
height: 20px;
fill: $color-brand;
margin-right: $small-spacing;
}
&__text {
@include navigation-link;
color: $color-brand;
}
}
</style>