mirror of https://github.com/nuxt/nuxt.git
45 lines
1.0 KiB
Vue
45 lines
1.0 KiB
Vue
<template>
|
|
<div class="relative w-full">
|
|
<AppHeader :links="headerLinks" />
|
|
|
|
<div class="lg:flex" :class="containerClass">
|
|
<slot v-if="['xs', 'sm', 'md'].includes($mq) || layout.aside" name="aside">
|
|
<AppAside :links="headerLinks" :class="layout.asideClass" />
|
|
</slot>
|
|
|
|
<div class="flex-auto w-full min-w-0 lg:static lg:max-h-full lg:overflow-visible">
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
<AppFooter />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { defineComponent } from '@nuxtjs/composition-api'
|
|
|
|
export default defineComponent({
|
|
data () {
|
|
return {
|
|
headerLinks: []
|
|
}
|
|
},
|
|
async fetch () {
|
|
const { $docus } = this
|
|
this.headerLinks = (await $docus
|
|
.search('/collections/header')
|
|
.fetch()).links
|
|
},
|
|
computed: {
|
|
layout () {
|
|
return this.$docus.layout.value
|
|
},
|
|
containerClass () {
|
|
if (this.layout.aside && this.layout.fluid) { return 'd-container-fluid' }
|
|
if (this.layout.aside) { return 'd-container' }
|
|
return ''
|
|
}
|
|
}
|
|
})
|
|
</script>
|