feat: add hide right sidebar configuration option

pull/980/head
Joaquín Sánchez Jiménez 3 years ago
parent e4c60ab3c8
commit f2445c1de9

@ -199,3 +199,18 @@ interface Feature {
details: string
}
```
## rightsidebar
- Type: `boolean`
This option only take effect when `layout` is set to `page`.
By default, the right aside will be shown, if you want to remove it, configure the option to `false`:
```yaml
---
rightsidebar: false
---
```

@ -6,7 +6,7 @@ import VPDocAside from './VPDocAside.vue'
import VPDocFooter from './VPDocFooter.vue'
const route = useRoute()
const { hasSidebar } = useSidebar()
const { hasSidebar, hasRightSidebar } = useSidebar()
const pageName = computed(() =>
route.path.replace(/[./]+/g, '_').replace(/_html$/, '')
@ -16,7 +16,7 @@ const pageName = computed(() =>
<template>
<div class="VPDoc" :class="{ 'has-sidebar': hasSidebar }">
<div class="container">
<div class="aside">
<div v-if="hasRightSidebar" class="aside">
<div class="aside-curtain" />
<div class="aside-container">
<div class="aside-content">
@ -33,7 +33,7 @@ const pageName = computed(() =>
</div>
<div class="content">
<div class="content-container">
<div class="content-container" :class="{ 'has-right-sidebar': hasRightSidebar }">
<slot name="doc-before" />
<main class="main">
@ -170,6 +170,9 @@ const pageName = computed(() =>
.content-container {
margin: 0 auto;
}
.content-container.has-right-sidebar {
max-width: 688px;
}
</style>

@ -22,6 +22,13 @@ export function useSidebar() {
)
})
const hasRightSidebar = computed(() => {
if (frontmatter.value.layout !== 'home' && frontmatter.value.rightsidebar === false)
return false
return hasSidebar.value
})
function open() {
isOpen.value = true
}
@ -38,6 +45,7 @@ export function useSidebar() {
isOpen,
sidebar,
hasSidebar,
hasRightSidebar,
open,
close,
toggle

Loading…
Cancel
Save