From 8f630339ba95cbaded97f0fcff9323755dd16bcc Mon Sep 17 00:00:00 2001
From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com>
Date: Thu, 1 Sep 2022 18:51:20 +0530
Subject: [PATCH] feat(theme): allow disabling whole layout (#1268)

---
 docs/guide/theme-layout.md          | 8 ++++----
 src/client/theme-default/Layout.vue | 7 +++++--
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/docs/guide/theme-layout.md b/docs/guide/theme-layout.md
index 33033102..09b5cff8 100644
--- a/docs/guide/theme-layout.md
+++ b/docs/guide/theme-layout.md
@@ -1,7 +1,3 @@
----
-layout: doc
----
-
 # Layout
 
 You may choose the page layout by setting `layout` option to the page [frontmatter](./frontmatter). There are 3 layout options, `doc`, `page`, and `home`. If nothing is specified, then the page is treated as `doc` page.
@@ -36,3 +32,7 @@ Note that even in this layout, sidebar will still show up if the page has a matc
 ## Home Layout
 
 Option `home` will generate templated "Homepage". In this layout, you can set extra options such as `hero` and `features` to customize the content further. Please visit [Theme: Home Page](./theme-home-page) for more details.
+
+## No Layout
+
+If you don't want any layout, you can pass `layout: false` through frontmatter. This option is helpful if you want a fully-customizable landing page (without any sidebar, navbar, or footer by default).
diff --git a/src/client/theme-default/Layout.vue b/src/client/theme-default/Layout.vue
index 882a8ec9..d21997bf 100644
--- a/src/client/theme-default/Layout.vue
+++ b/src/client/theme-default/Layout.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { provide, watch } from 'vue'
-import { useRoute } from 'vitepress'
+import { useData, useRoute } from 'vitepress'
 import { useSidebar, useCloseSidebarOnEscape } from './composables/sidebar.js'
 import VPSkipLink from './components/VPSkipLink.vue'
 import VPBackdrop from './components/VPBackdrop.vue'
@@ -22,10 +22,12 @@ watch(() => route.path, closeSidebar)
 useCloseSidebarOnEscape(isSidebarOpen, closeSidebar)
 
 provide('close-sidebar', closeSidebar)
+
+const { frontmatter } = useData()
 </script>
 
 <template>
-  <div class="Layout">
+  <div v-if="frontmatter.layout !== false" class="Layout">
     <slot name="layout-top" />
     <VPSkipLink />
     <VPBackdrop class="backdrop" :show="isSidebarOpen" @click="closeSidebar" />
@@ -61,6 +63,7 @@ provide('close-sidebar', closeSidebar)
     <VPFooter />
     <slot name="layout-bottom" />
   </div>
+  <Content v-else />
 </template>
 
 <style scoped>