quarto-dev / quarto-dev/quarto-cli

banner and sidebars

Open
#11,286 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug website-navigation websites
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

When using a sidebar menu in hybrid navigation without bread-crumbs, the title of the content referenced in the sidebar is not placed inside the banner in mobile width.
Using bread-crumbs brings the correct behavior.

Steps to reproduce

_quarto.yml

project:
  type: website

website:
  title: "banner"
  bread-crumbs: false 
  navbar:
    left:
      - href: index.qmd
        text: Home
      - sidebar:sidebar
      
  sidebar:
    - id: sidebar
      title: sidebar
      contents: 
        - text: content1
          file: content1.qmd

format:
  html:
    theme: cosmo
    css: styles.css
    toc: true
    title-block-banner: 966-600x200.jpg
    

editor: visual

ìndex.qmd``

---
title: "index"
---

This is a Quarto website.

To learn more about Quarto websites visit <https://quarto.org/docs/websites>.

```{r}
1 + 1
```

`content1.qmd``

---
title: "content1"
---

This is a Quarto website.

To learn more about Quarto websites visit <https://quarto.org/docs/websites>.

```{r}
1 + 1
```
Expected behavior

The title for content1.qmd should be inside (above) the banner.

Actual behavior

Image

Your environment

RStudio 2024.09.1 396
R 4.4.1
MacOS 15.1

Quarto check output
Quarto 1.6.32
[✓] Checking environment information...
      Quarto cache location: /Users/xt/github/Library/Caches/quarto
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.4.0: OK
      Dart Sass version 1.70.0: OK
      Deno version 1.46.3: OK
      Typst version 0.11.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.6.32
      Path: /Applications/quarto/bin

[✓] Checking tools....................OK
      TinyTeX: (external install)
      Chromium: (not installed)

[✓] Checking LaTeX....................OK
      Using: Installation From Path
      Path: /usr/local/bin
      Version: 2024

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.9.6
      Path: /Library/Developer/CommandLineTools/usr/bin/python3
      Jupyter: (None)

      Jupyter is not available in this Python installation.
      Install with python3 -m pip install jupyter

[✓] Checking R installation...........OK
      Version: 4.4.1
      Path: /Library/Frameworks/R.framework/Resources
      LibPaths:
        - /Library/Frameworks/R.framework/Versions/4.4-arm64/Resources/library
      knitr: 1.48
      rmarkdown: 2.28

[✓] Checking Knitr engine render......OK

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the mobile-width layout from _quarto.yml using index.qmd, content1.qmd, and styles.css, with bread-crumbs disabled and title-block-banner enabled. Compare the sidebar-linked content page with the expected banner behavior. Done means the content1 title appears above and inside the banner without requiring bread-crumbs.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.