Sidebar settings persist across all navbar pages, even when individual pages define their own local sidebar settings or none

[fsaforo1]

Description

How can I create a website with multiple pages—say, about, notes, and blog—each with different sidebar configurations?

Below are the issues:

1. I want the about and notes pages to have sidebars with different content and background colors (e.g., green for about, blue for notes). However, the sidebar color set for the first page seems to apply globally across all pages (e.g., green is used everywhere).

Click here to view example _quarto.yml file

project:
  type: website
  output-dir: _site

website:
  title: "Sidebar Examples"
  bread-crumbs: false
  navbar:
    pinned: true
    left:
      - text: "About the Team"
        href: about/index.qmd
      - text: "Notes"
        href: notes/index.qmd
      - text: "Blog"
        href: blog/index.qmd
  sidebar:
    - id: about
      title: "About the Team"
      style: docked
      background: "#377771"
      contents:
        - section: "Organization"
          contents: about/index.qmd
        - section: "People"
          contents:
            - text: "Team Member 1"
              href: about/people/member1.qmd
            - text: "Team Member 2"
              href: about/people/member2.qmd
    - id: notes
      title: "Notes"
      style: docked
      background: "#283044"
      contents:
        - section: "Recent Posts"
          contents:
            - text: "Welcome Post"
              href: notes/posts/welcome.qmd
            - text: "Technical Guide"
              href: notes/posts/technical-guide.qmd
        - section: "Categories"
          contents:
            - text: "Tutorials"
              href: notes/category/tutorials.qmd
            - text: "News"
              href: notes/category/news.qmd

format:
  html:
    theme: cosmo

Notice that the sidebar background colors were set to different colors for the about and notes pages.

2. For the blog page, I don’t want a sidebar at all. But when I set the table of contents (ToC) to appear on the left, it ends up inheriting the sidebar settings and pushes the blog content to the left—unlike when the ToC is on the right, which works as expected and the content appear expectedly centered.

When toc is set to left:

When toc is set to right

How can I make each page’s sidebar settings independent and prevent the ToC from behaving like a sidebar on pages that don’t use one?

Specs:

• quarto version: 1.6.40
• Reproducible code: https://github.com/fsaforo1/quarto_sidebar_ext/tree/main

[fsaforo1]

@mcanouil can you help?

[fsaforo1]

This appears to be a known bug - #8431 (comment)