feat: support hiding the main sidebar in desktop site (#778)

* feat: Remove the main sidebar entirely to free up more space for the main content of the page

* fix: ensure that the footer switches are still visible when the main sidebar has been disabled

* refactor: Repurpose Params.sidebar.hide to disable the main sidebar and disable the placeholder rather than adding a new front matter parameter

* fix: change wording from "disable" to "hide" in the documentation for hiding the sidebar

* fix: using incorrect hidden class in sidebar.html broke mobile navigation. Fixed this

---------

Co-authored-by: Xin <5097752+imfing@users.noreply.github.com>
This commit is contained in:
Keith Stockdale
2025-09-10 22:45:12 +01:00
committed by GitHub
parent 1b536e27a5
commit 3bc454bbf6
2 changed files with 24 additions and 4 deletions

View File

@@ -164,6 +164,21 @@ menu:
weight: 3
```
### Hiding
Hiding the sidebar can be done using front matter:
```yaml {filename="content/docs/guide/configuration.md"}
---
title: Configuration
sidebar:
hide: true
---
```
This will hide the main sidebar from the page, freeing up space for the main content of the page.
## Right Sidebar
### Table of Contents

View File

@@ -3,17 +3,22 @@
{{- $disableSidebar := .disableSidebar | default false -}}
{{- $displayPlaceholder := .displayPlaceholder | default false -}}
{{- $sidebarClass := cond $disableSidebar (cond $displayPlaceholder "hx:md:hidden hx:xl:block" "hx:md:hidden") "hx:md:sticky" -}}
{{- $navRoot := cond (eq site.Home.Type "docs") site.Home $context.FirstSection -}}
{{- $pageURL := $context.RelPermalink -}}
{{/* EXPERIMENTAL */}}
{{- if .context.Params.sidebar.hide -}}
{{- $disableSidebar = true -}}
{{- $displayPlaceholder = true -}}
{{- $displayPlaceholder = false -}}
{{- end -}}
{{- $sidebarClass := "hx:md:sticky" -}}
{{- if $disableSidebar -}}
{{- if $displayPlaceholder -}}
{{- $sidebarClass = "hx:md:hidden hx:xl:block" -}}
{{- else -}}
{{- $sidebarClass = "hx:md:hidden" -}}
{{- end -}}
{{- end -}}
<aside class="hextra-sidebar-container hx:flex hx:flex-col hx:print:hidden hx:md:top-16 hx:md:shrink-0 hx:md:w-64 hx:md:self-start hx:max-md:[transform:translate3d(0,-100%,0)] {{ $sidebarClass }}">
<!-- Search bar on small screen -->