Brand: logo paths are resolved incorrectly for documents in sub directories

[gadenbuie]

Bug description

Originally posted in posit-dev/brand-yml#66 (comment) by @szimmer:

I have an images folder in the root of a quarto site project. I then wanted to have subdirectories and some .qmd files in those subdirectories. When I do this, the icons work on the site but not on files in the subdirectory. I made a fairly small example.

• The slides that are in the root directory show the icons: https://szimmer.github.io/try-quarto-brand/slides.html#/title-slide
• The slides in the subdirectory do not show the icons: https://szimmer.github.io/try-quarto-brand/slides/slides.html#/title-slide

It would be ideal if branding worked in all directories.

Steps to reproduce

See https://github.com/szimmer/try-quarto-brand, which contains a _brand.yml file with (essentially)

logo:
  small: images/favicon.png
  medium: images/favicon.png

a _quarto.yml

project:
  type: website

website:
  title: "tmpsite"
  navbar:
    left:
      - href: index.qmd
        text: Home
      - about.qmd

format:
  html:
    theme:
      - cosmo
      - brand
    css: styles.css
    toc: true

and two slides files

* slides.qmd
* slides/slides.qmd

Both slide files are identical

---
title: "Untitled"
format: revealjs
---

## Here's a slide

Expected behavior

Both slides, when rendered, should show the logo in the slides.

Actual behavior

Only the slides.qmd has the logo, slides/slides.qmd has a broken image.

• ✅ slides.html
• ❌ slides/slides.html

Your environment

• GitHub Actions: ubuntu-latest
• Quarto: v1.6.40
• https://github.com/szimmer/try-quarto-brand/blob/main/.github/workflows/publish.yml

Quarto check output

quarto v1.6.40

[mcanouil]

What about adding a leading / as Quarto uses this to tell it's from the root of the project?

Edit: following Quarto's convention on paths

Screen.Recording.2025-01-29.at.16.38.14.mov

[mcanouil]

Side note, the following content in _brand.yml makes Quarto (main) crash but I was expected this with keys that have no values.

defaults:
  bootstrap:
    # bootstrap variable definitions
  quarto:
    format:
      # basic format-specific settings
      html:
      revealjs:
  shiny:
    # shiny specific settings

ERROR: Brand validation failed for /Users/mcanouil/Projects/misc/try-quarto-brand/_brand.yml.

In file _brand.yml
(line 56, columns 5--37) Field "bootstrap" has value # bootstrap variable definitions, which must instead be an object
55:   bootstrap:
56:     # bootstrap variable definitions
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
57:   quarto:
✖ The value # bootstrap variable definitions is of type a null value.
ℹ The error happened in location defaults:bootstrap.


Stack trace:

In file _brand.yml
(line 56, columns 5--37) Field "bootstrap" has value # bootstrap variable definitions, which must instead be an object
55:   bootstrap:
56:     # bootstrap variable definitions
       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
57:   quarto:
✖ The value # bootstrap variable definitions is of type a null value.
ℹ The error happened in location defaults:bootstrap.

    at readAndValidateYamlFromFile (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/core/schema/validated-yaml.ts:51:11)
    at async projectResolveBrand (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/project/project-shared.ts:536:21)
    at async websiteNavigationConfig (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/project/types/website/website-shared.ts:167:24)
    at async initWebsiteNavigation (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/project/types/website/website-navigation.ts:167:7)
    at async Object.preRender (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/project/types/website/website.ts:120:5)
    at async renderProject (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/command/render/project.ts:397:5)
    at async Command.actionHandler (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/command/render/cmd.ts:248:26)
    at async Command.execute (https://deno.land/x/cliffy@v1.0.0-rc.3/command/command.ts:1948:7)
    at async Command.parseCommand (https://deno.land/x/cliffy@v1.0.0-rc.3/command/command.ts:1780:14)
    at async quarto (file:///Users/mcanouil/Projects/quarto/quarto-cli/src/quarto.ts:190:5)

[mcanouil]

The trick question now is: does all tools using _brand.yml will read a leading / the same way?
Or should Quarto maybe prepend / in _brand.yml paths when appropriate? @gadenbuie @cscheid

[gadenbuie]

The trick question now is: does all tools using _brand.yml will read a leading / the same way?

No, in Python and R, paths inside _brand.yml are intended to be relative to the _brand.yml file. This is important outside of Quarto because _brand.yml files can be in subdirectories and are intended to be portable.

If Quarto wants to keep the leading /, it should only work inside _quarto.yml or places where brand is provided directly. Paths inside _brand.yml (or by any other name) should be relative to the brand.yml file.

[cscheid]

This is a bug. Relative paths should be resolved relative to the path of the file defining the paths.

[mcanouil]

This is a bug. Relative paths should be resolved relative to the path of the file.

I'm confused. Relative to Which file?
I'm guessing you mean relative to _brand.yml.
Because currently the paths are resolved as relative to input/output files (qmd/html) and that's the issue.

For completeness, it's not only abut slides not picking up the logo, but anything using the logo such as the "brand" shortcode ({{< brand logo header >}}) anywhere but at the root of the project.