marc-leopold/layouts/default.vue

58 lines
802 B
Vue

<template>
<div class="page-container">
<div class="page">
<nuxt />
</div>
<SiteMenu class="menu"
:is-open="isMenuOpen"
@toggleMenu="toggleMenu"
/>
</div>
</template>
<script>
import SiteMenu from '~/components/SiteMenu'
export default {
components: {
SiteMenu
},
data() {
return {
isMenuOpen: true,
}
},
methods: {
toggleMenu () {
this.isMenuOpen = !this.isMenuOpen
}
}
}
</script>
<style scoped lang="scss">
.page-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: orange; // TEMP
}
.page {
z-index: $z-index__page;
position: relative;
width: 100%;
height: 100%;
}
.menu {
z-index: $z-index__menu;
}
</style>