quarto-dev · cderv · May 14, 2025 · May 13, 2025 · May 14, 2025 · May 14, 2025
diff --git a/news/changelog-1.8.md b/news/changelog-1.8.md
@@ -11,6 +11,7 @@ All changes included in 1.8:
 ### `html`
 
 - ([#12259](https://github.com/quarto-dev/quarto-cli/issues/12259)): Fix conflict between `html-math-method: katex` and crossref popups (author: @benkeks).
+- ([#12734](https://github.com/quarto-dev/quarto-cli/issues/12734)): `highlight-style` now correctly supports setting a different `light` and `dark`.
 
 ### `revealjs`
 

diff --git a/src/quarto-core/text-highlighting.ts b/src/quarto-core/text-highlighting.ts
@@ -41,8 +41,8 @@ export function textHighlightThemePath(
   // First try the style specific version of the theme, otherwise
   // fall back to the plain name
   const names = [
-    `${theme}-${style === "dark" ? kDarkSuffix : kLightSuffix}`,
-    theme,
+    `${resolvedTheme}-${style === "dark" ? kDarkSuffix : kLightSuffix}`,
+    resolvedTheme,
   ];
 
   const themePath = names.map((name) => {

diff --git a/tests/docs/playwright/html/code-highlight/_body.md b/tests/docs/playwright/html/code-highlight/_body.md
@@ -0,0 +1,15 @@
+## Light and Dark Mode Testing
+
+This document can be viewed in both light mode and dark mode to test code highlighting in both color schemes.
+
+```{.julia}
+function divide_floats(x::Float64, y::Float64)
+    return x / y
+end
+```
+
+And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+
+::: {.callout-note}
+The tests will automatically check the highlighting in both light and dark modes using Playwright's color scheme testing capabilities.
+:::
diff --git a/tests/docs/playwright/html/code-highlight/_quarto.yml b/tests/docs/playwright/html/code-highlight/_quarto.yml
@@ -1,3 +1,11 @@
 project:
   type: default
   title: "Quarto Code Highlighting"
+  output-dir: _docs
+
+format:
+  html:
+    theme:
+      light: flatly
+      dark: darkly
+    respect-user-color-scheme: true
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-a11y.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-a11y.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing a11y code highlight
 highlight-style: a11y
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-arrow.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-arrow.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing arrow code highlight
 highlight-style: arrow
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-atom-one.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-atom-one.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing atom-one code highlight
 highlight-style: atom-one
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-ayu-mirage.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-ayu-mirage.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing ayu-mirage code highlight
 highlight-style: ayu-mirage
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-ayu.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-ayu.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing ayu code highlight
 highlight-style: ayu
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-breeze.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-breeze.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing breeze code highlight
 highlight-style: breeze
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-breezedark.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-breezedark.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing breezedark code highlight
 highlight-style: breezedark
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-dracula.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-dracula.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing dracula code highlight
 highlight-style: dracula
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-espresso.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-espresso.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing espresso code highlight
 highlight-style: espresso
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-github.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-github.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing github code highlight
 highlight-style: github
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-gruvbox.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-gruvbox.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing gruvbox code highlight
 highlight-style: gruvbox
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-haddock.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-haddock.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing haddock code highlight
 highlight-style: haddock
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-kate.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-kate.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing kate code highlight
 highlight-style: kate
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-light-dark.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-light-dark.qmd
@@ -0,0 +1,9 @@
+---
+format:
+  html:
+    highlight-style:
+        light: pygments
+        dark: kate
+---
+
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-monochrome.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-monochrome.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing monochrome code highlight
 highlight-style: monochrome
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-monokai.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-monokai.qmd
@@ -1,23 +1,6 @@
 ---
 title: Testing monokai code highlight
 highlight-style: monokai
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-## Light and Dark Mode Testing
-
-This document can be viewed in both light mode and dark mode to test code highlighting in both color schemes.
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
-
-::: {.callout-note}
-The tests will automatically check the highlighting in both light and dark modes using Playwright's color scheme testing capabilities.
-:::
+{{< include _body.md >}}
diff --git a/tests/docs/playwright/html/code-highlight/code-highlight-nord.qmd b/tests/docs/playwright/html/code-highlight/code-highlight-nord.qmd
@@ -1,16 +1,6 @@
 ---
 title: Testing nord code highlight
 highlight-style: nord
-theme: 
-  light: flatly
-  dark: darkly
 ---
 
-
-```{.julia}
-function divide_floats(x::Float64, y::Float64)
-    return x / y
-end
-```
-
-And here the inline version `function divide_floats(x::Float64, y::Float64)`{.julia}.
+{{< include _body.md >}}