search

quarto-dev / quarto-cli

Open-source scientific and technical publishing system built on Pandoc.
https://quarto.org
Other
3.93k stars 325 forks source link

New theme generation and filenaming with hashing should apply to dark mode style too #10819

Closed cderv closed 4 days ago

cderv commented 1 month ago

This is a follow up on 1.6 fix

The current solution does not apply to dark theme which builds to bootstrap-dark.min.css. No hash is used. 

quarto create project website test-dark

Add to about.qmd this config

format:
  html:
    fontcolor: red

and this in _qaurto.yml

format:
  html:
    theme: 
      light: flatly
      dark: darkly

Then do quarto render

Light theme

This now works well. The red font color will only apply to about.html, and not the entire website

Dark theme

Switch to dark theme now with toggle. This still doesn't work and the configuration applies to whole website, like initial issue for light theme

When looking at CSS files produced we see no hash is appended. 

❯ ls .\_site\site_libs\bootstrap\

    Directory: C:\Users\chris\AppData\Local\Temp\quarto\test-subdir\_site\site_libs\bootstrap

Mode                 LastWriteTime         Length Name
----                 -------------         ------ ----
-a---          17/09/2024    11:26         474885 bootstrap-cbee0a5f18ab906682e9d4fb633eabe1.min.css
-a---          17/09/2024    11:27         474541 bootstrap-dark.min.css
-a---          17/09/2024    11:27         474797 bootstrap-fcdf0d5c94eae0f74b37b7cfe1fba367.min.css
-a---          05/09/2024    15:43          98163 bootstrap-icons.css
-a---          17/09/2023    07:15         176200 bootstrap-icons.woff
-a---          05/09/2024    15:50          80668 bootstrap.min.js

We probably need to extend the initial fix to dark theming too, to have a boostrap-dark-<hash>.min.css.

@cscheid you may know how to do it quickly. Otherwise, I can take a shot at this based on #10611

mcanouil commented 1 month ago

While at it, there is:

cderv commented 1 month ago

Not the same. I opened this new one because I was looking at the other one and noticed this odd behavior.

I didn't link because not the same problem and so not the same fix.

cscheid commented 4 days ago

I believe the source of the bug is that we're forcibly renaming the generated CSS (which has a hash) to a name which doesn't, here:

https://github.com/quarto-dev/quarto-cli/blob/main/src/command/render/pandoc-html.ts#L121

cderv commented 4 days ago

I agree. We should try to name something like boostrap-dark-<hash>.min.css 🤔