quarto render stuck on light instead of primary for all themes

[silverhikari]

Description

quarto: 1.9.37
OS: Linux Cachyos

when rendering a blog the theme is stuck at using light instead of primary. this happens even with a newly created blog created by quarto create. i have attempted deleting .cache/quarto/sass to see if that fixes the problem that does not work

[mcanouil]

Did you define both light and dark as documented? https://quarto.org/docs/websites/website-tools.html#dark-mode

I suspect you did not, but if you did, then could you share a small self-contained "working" (reproducible) example to work with, i.e., a complete Quarto document or a Git repository? The goal is to make it as easy as possible for us to recreate your problem so that we can fix it: please help us help you! Thanks.

---

You can share a self-contained "working" (reproducible) Quarto document using the following syntax, i.e., using more backticks than you have in your document (usually four ````).
See https://quarto.org/bug-reports.html#small-is-beautiful-aim-for-a-single-document-with-10-lines.

If you have multiple files (and if it is absolutely required to have multiple files), please share as a Git repository.

R	Python
````qmd --- title: "Reproducible Quarto Document" format: html engine: knitr --- This is a reproducible Quarto document. {{< lipsum 1 >}} ```{r} x <- c(1, 2, 3, 4, 5) y <- c(1, 4, 9, 16, 25) plot(x, y) ``` {#fig-placeholder} {{< lipsum 1 >}} The end after @fig-placeholder. ````	````qmd --- title: "Reproducible Quarto Document" format: html engine: jupyter --- This is a reproducible Quarto document. {{< lipsum 1 >}} ```{python} import matplotlib.pyplot as plt x = [1, 2, 3, 4, 5] y = [1, 4, 9, 16, 25] plt.plot(x, y) plt.show() ``` {#fig-placeholder} {{< lipsum 1 >}} The end after @fig-placeholder. ````

Additionally and if not already given, please share the output of quarto check within a code block (i.e., using three backticks ```txt), see https://quarto.org/bug-reports.html#check.

[silverhikari]

here is it though i have no clue how to get the navbar to show up:

---
project:
    type: website
website:
    title: "test"
    navbar:
        right:
        - icon: github
format:
  html:
    theme: cosmo
---


```txt
Quarto 1.9.37
[✓] Checking environment information...
      Quarto cache location: /home/silver/.cache/quarto
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.8.3: OK
      Dart Sass version 1.87.0: OK
      Deno version 2.4.5: OK
      Typst version 0.14.2: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.9.37
      Path: /opt/quarto/bin

[✓] Checking tools....................OK
      TinyTeX: (not installed)
      Chromium: (not installed)
      Chrome Headless Shell: (not installed)
      VeraPDF: (not installed)

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

[✓] Checking Chrome Headless....................OK
      Chrome:  (not detected)

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

[✓] Checking R installation...........(None)

      Unable to locate an installed version of R.
      Install R from https://cloud.r-project.org/

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

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

[✓] Checking Julia installation...
```

[silverhikari]

tried that, the header bar is still white no matter if setting cosmo as the light theme or as the dark theme

[mcanouil]

Important

Accessibility: To improve accessibility, please add alternative text to your screenshots. This helps all users, including those using screen readers, to understand the context of the images. A brief description can make a big difference! See Good Alt Text, Bad Alt Text — Making Your Content Perceivable.

---

I cannot reproduce.

1. quarto create project website i14537 i14537
2. Replacing theme in _quarto.yml as theme: { light: darkly, dark: cosmo } (you can write it multiline, I get the same result)
3. quarto preview index.qmd

You need to precisely state what you are doing with what.

Note that your screenshot shows that dark mode is enabled, which in your config means "cosmo", so all is as expected in it.

[silverhikari]

simply on the cosmo theme i want it to be using the $primary(#2780e3) color which it was for a while when building the website / blog, but now no matter if building the website right out of creation or changing the theme to use cosmos as a light theme or a dark theme, it defaults to $light ($gray-500)

[mcanouil]

Then it has nothing to do with the theme mode.
Theme has defaults, either change theme following the documentation via the sass variables, or use yaml.

website:
  navbar:
    background: primary

And again that's documented in the links I shared.

[silverhikari]

at this point i will just accept it that it was wierd code junk or something left over in the cache, because i still don't know why it was blue in the first place if you have to set it via a option in the yaml, when it started out as blue directly out of website creation the first time i created the site

[mcanouil]

it might have been blue in 1.3 or earlier, so more than 2 years ago.
Anyhow, use SASS variable or the yaml above to change the default to your liking.

[mcanouil]

Putting the direct links for reference:

• https://quarto.org/docs/output-formats/html-themes.html#navigation
• https://quarto.org/docs/websites/website-navigation.html#top-navigation

[silverhikari]

pretty much i create the blog via "quarto create", select "project", "blog", and create the blog.
i change nothing: here is _quarto.yml:

project:
  type: website

website:
  description: "A blog built with Quarto"
  site-url: https://your-website-url.example.com # you must change this appropriately for RSS feeds to work properly
  title: "blog"
  navbar:
    right:
      - about.qmd
      - icon: github
        href: https://github.com/
      - icon: bluesky
        href: https://bsky.app/
format:
  html:
    theme:
      - cosmo
      - brand
    css: styles.css

but instead of the navbar being blue (which it was for a short time but now wither building with quarto preview in vscode with extension or with quarto render), it default to white: