<template>
<div>
  	<ParentLayout>
    
      <template v-slot:page-bottom>
          <component v-if="dynamicComponent" :is="dynamicComponent" :page="$page"> </component>
      </template>
    </ParentLayout>
</div>
</template>

<script>
import ParentLayout from '@parent-theme/layouts/Layout.vue'

export default {
	name: 'OpenApiLayout',
	components: {
		ParentLayout,
	},
	data() {
    return {
      dynamicComponent: null
    }
  },
  mounted () {
    import('@theme/components/OpenApi.vue').then(module => {
      this.dynamicComponent = module.default
    })
  }
}
</script>


<style>
  .custom-layout .theme-default-content{
    padding-top:0px;
  }

  .custom-layout .theme-default-content:not(.custom) > h1{
    padding-top:1em;
  }
</style>

<style src="../styles/variables.styl" lang="stylus"></style>
<style src="../styles/index.styl" lang="stylus"></style>
<style src="../styles/themes/dark.styl" lang="stylus"></style>
<style src="../styles/themes/blue.styl" lang="stylus"></style>
<style src="../styles/themes/red.styl" lang="stylus"></style>
<style src="../styles/themes/purple.styl" lang="stylus"></style>
