skillbox/client/src/layouts/FullScreenLayout.vue

51 lines
909 B
Vue

<template>
<div
:class="specialContainerClass"
class="container layout layout--fullscreen">
<div
class="close-button"
@click="back">
<cross class="close-button__icon"/>
</div>
<router-view class="layout__content"/>
</div>
</template>
<script>
import Cross from '@/components/icons/Cross';
export default {
components: {
Cross
},
computed: {
specialContainerClass() {
let cls = this.$store.state.specialContainerClass;
return [cls ? `skillbox--${cls}` : '']
}
},
methods: {
back() {
this.$router.go(-1);
}
}
}
</script>
<style lang="scss" scoped>
@import "@/styles/_default-layout.scss";
.close-button {
margin-top: $medium-spacing;
margin-right: $medium-spacing;
justify-self: end;
cursor: pointer;
display:flex;
justify-content:end;
}
</style>