litera navbar background color used to be $white, now is $primary

[DavisVaughan]

Bug description

My website is here https://blog.davisvaughan.com/

It uses litera as a theme
https://github.com/DavisVaughan/blog/blob/a97cc9ff32895ff1d05f0fe4ccb6490b2352d452/custom.scss#L4

It has always had a white navbar background

I just updated Quarto locally after a looooong time, and now the primary color is being used as the navbar background (im not setting $primary anywhere).

I greatly prefer the white default.

I've tracked this back to this bug fix #7447

Corresponding to this commit ef91ac8

Particularly:

So it looks like it definitely used to just be $white.

Was that change intended? I can fix it with this, but I just wanted to make sure this was purposeful.

website:
  navbar:
    background: white

The version this change was introduced in is v1.4.479.

Steps to reproduce

No response

Expected behavior

No response

Actual behavior

No response

Your environment

No response

Quarto check output

quarto v1.4.479 is the first version this happened in

[cscheid]

Let's move this to a discussion - it was clearly an intentional choice.

[DavisVaughan]

If I pull up "litera theme" on the Bootswatch website, the first thing it shows you is that blue navbar. Maybe it was supposed to do that all along? https://bootswatch.com/litera/

[cscheid]

Yes, I think that's the case.

See below, though: I can't repro your report on a clean project.

[cderv]

Personally, I think there is more to it when I see

quarto-cli/src/resources/formats/html/bootstrap/_bootstrap-functions.scss

Lines 138 to 140 in 5c38d77

	litera: (
	navbar-bg: if($default == #4582ec, $white, $default),
	),

litera is part of the themes where quarto initially choose some other defaults than Boostwatch. (this is what theme_override is about). And the change from ef91ac8 are supposed to keep that for default, but do respect other value for $primary. And to me this is what #7447 was about.

So I would like to understand more on this as it seems to me ef91ac8 to fix #7447 is not completely working in the sense the initial quarto's default are not kept.

Though, maybe we may prefer this new defaults now. But I don't understand ef91ac8 change in that case.

To be discussed.

[DavisVaughan]

I use litera plus some customizations. How else would I do that if theme: in _quarto.yml can only take either litera or custom.scss? https://github.com/DavisVaughan/blog/blob/main/custom.scss

[cscheid]

FWIW, if you're willing to use the dev version of Quarto, we now have tooling to help explain what happens in SCSS. You use it like this:

$ QUARTO_SAVE_SCSS=out quarto render index.qmd
...
$ ls out*.scss
out-1.scss out-2.scss [this happens because we generate two SCSS files]
$ cd ~/quarto-cli/tools/sass-variable-explainer
$ quarto preview sass-ui.qmd

You'll see a page that looks like this:

Now open the correct out-* sass file (it'll be the largest one; the other one is only used for syntax highlighting)

You'll see all color variables in the SCSS file, and you can click on them to see the dependency chains.

[cscheid]

Like so:

Screen.Recording.2024-10-04.at.10.54.07.AM.mov

[gadenbuie]

How else would I do that if theme: in _quarto.yml can only take either litera or custom.scss?

@DavisVaughan theme can take an array, e.g. the base litera theme with additional custom.scss layered on top:

theme:
  - litera
  - custom.scss

[cderv]

Other doc link about this is this one: https://quarto.org/docs/output-formats/html-themes.html#theme-options

And I believe our examples websites are also using this.

I am curious how you ended using $theme variable for setting a quarto theme. Was it showed as example somewhere ?

Or maybe the custom theme part is not detailed enough as we link to theme's source code. 🤔