55 lines
998 B
Vue
55 lines
998 B
Vue
<template>
|
|
<div
|
|
class="add-room-entry-button"
|
|
data-cy="add-room-entry-button"
|
|
@click="addRoomEntry">
|
|
<add-icon class="add-room-entry-button__icon"/>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import AddIcon from '@/components/icons/AddIcon';
|
|
|
|
export default {
|
|
props: ['parent'],
|
|
|
|
components: {
|
|
AddIcon
|
|
},
|
|
|
|
methods: {
|
|
addRoomEntry() {
|
|
this.$store.dispatch('addRoomEntry', this.parent);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "@/styles/_variables.scss";
|
|
@import "@/styles/_mixins.scss";
|
|
|
|
.add-room-entry-button {
|
|
border: 2px solid $color-white;
|
|
border-radius: 12px;
|
|
height: 150px;
|
|
box-sizing: border-box;
|
|
margin-bottom: 25px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
break-inside: avoid-page;
|
|
cursor: pointer;
|
|
overflow: hidden;
|
|
|
|
display: none;
|
|
@include desktop {
|
|
display: flex;
|
|
}
|
|
|
|
&__icon {
|
|
width: 80px;
|
|
fill: $color-white;
|
|
}
|
|
}
|
|
</style>
|