Skip to content

Commit 8e9761e

Browse files
gordonwoodhullgordonwoodhull
committed
revealjs: use common resolveLogo, implement alt
fixes #10933 allows customization of light and dark logos in document consistent with rest of formats deletes 25 lines of code
1 parent bcd87c9 commit 8e9761e

7 files changed

Lines changed: 179 additions & 38 deletions

File tree

‎news/changelog-1.8.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ All changes included in 1.8:
3333

3434
### `revealjs`
3535

36+
- ([#10933](https://github.com/quarto-dev/quarto-cli/issues/10933)): Revealjs supports alt text on logo, as well as customization of light and dark logos at the document level, consistent with other formats.
3637
- ([#12550](https://github.com/quarto-dev/quarto-cli/issues/12550)): Revealjs supports `brand-mode`, allowing to select either the light or the dark brand.
3738
- ([#12598](https://github.com/quarto-dev/quarto-cli/pull/12598)): Ensure `.fragment` on an image with caption applies to whole figure.
3839
- ([#12716](https://github.com/quarto-dev/quarto-cli/issues/12716)): Correctly resolve `"brand"` set in `theme` configuration for document in subdirectory from project root.

‎src/format/reveal/format-reveal.ts‎

Lines changed: 11 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@ import { ProjectContext } from "../../project/types.ts";
7979
import { titleSlidePartial } from "./format-reveal-title.ts";
8080
import { registerWriterFormatHandler } from "../format-handlers.ts";
8181
import { pandocNativeStr } from "../../core/pandoc/codegen.ts";
82+
import { resolveLogo } from "../../core/brand/brand.ts";
8283

8384
export function revealResolveFormat(format: Format) {
8485
format.metadata = revealMetadataFilter(format.metadata);
@@ -377,52 +378,25 @@ export function revealjsFormat() {
377378
);
378379
}
379380

380-
const determineRevealLogo = (
381-
brandMode: "light" | "dark",
382-
format: Format,
383-
): string | undefined => {
384-
const brandData = format.render.brand?.[brandMode]?.processedData;
385-
if (brandData?.logo) {
386-
// add slide logo if we have one
387-
for (const size of Zod.BrandNamedLogo.options) {
388-
const logoInfo = brandData.logo[size];
389-
if (!logoInfo) {
390-
continue;
391-
}
392-
if (logoInfo) {
393-
return logoInfo.path;
394-
}
395-
}
396-
}
397-
};
398-
399381
function revealMarkdownAfterBody(format: Format) {
400382
let brandMode: "light" | "dark" = "light";
401383
if (format.metadata[kBrandMode] === "dark") {
402384
brandMode = "dark";
403385
}
404386
const lines: string[] = [];
405387
lines.push("::: {.quarto-auto-generated-content style='display: none;'}\n");
406-
let revealLogo = format
388+
const revealLogo = format
407389
.metadata[kSlideLogo] as (string | { path: string } | undefined);
408-
if (revealLogo) {
409-
if (typeof revealLogo === "object") {
410-
revealLogo = revealLogo.path;
411-
}
412-
if (Zod.BrandNamedLogo.options.includes(revealLogo as BrandNamedLogo)) {
413-
const brandData = format.render.brand?.[brandMode]?.processedData;
414-
const logoInfo = brandData?.logo
415-
?.[revealLogo as BrandNamedLogo];
416-
if (logoInfo) {
417-
revealLogo = logoInfo.path;
418-
}
419-
}
420-
} else {
421-
revealLogo = determineRevealLogo(brandMode, format);
422-
}
423-
if (revealLogo) {
390+
const logo = resolveLogo(format.render.brand, revealLogo, [
391+
"small",
392+
"medium",
393+
"large",
394+
]);
395+
if (logo && logo[brandMode]) {
396+
const modeLogo = logo[brandMode]!;
397+
const altText = modeLogo.alt ? `alt="${modeLogo.alt}" ` : "";
424398
lines.push(
425-
`<img src="${revealLogo}" class="slide-logo" />`,
399+
`<img src="${modeLogo.path}" ${altText}class="slide-logo" />`,
426400
);
427401
lines.push("\n");
428402
}

‎src/resources/schema/document-reveal-content.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
tags:
33
formats: [revealjs]
44
schema:
5-
ref: logo-specifier
5+
ref: logo-light-dark-specifier
66
description: "Logo image (placed in bottom right corner of slides)"
77

88
- name: footer

‎tests/docs/smoke-all/revealjs/brand-mode/brand-logo-alt-override.qmd‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
title: brand-mode and revealjs
3+
format: revealjs
4+
brand:
5+
logo:
6+
images:
7+
sun:
8+
path: sun-face.png
9+
alt: sun face
10+
moon:
11+
path: moon-face.png
12+
alt: moon face
13+
medium:
14+
light: sun
15+
dark: moon
16+
color:
17+
foreground:
18+
light: '#222'
19+
dark: '#eee'
20+
background:
21+
light: '#eee'
22+
dark: '#222'
23+
typography:
24+
headings:
25+
color:
26+
light: '#429'
27+
dark: '#54e'
28+
logo:
29+
light:
30+
path: sun
31+
alt: SUN
32+
dark:
33+
path: moon
34+
alt: MOON
35+
_quarto:
36+
tests:
37+
revealjs:
38+
ensureHtmlElements:
39+
-
40+
- 'img[src="sun-face.png"][alt="SUN"]'
41+
-
42+
- 'img[src="moon-face.png"][alt="MOON"]'
43+
---
44+
45+
## Here's a slide
46+
47+
- in {{< meta brand-mode >}} mode!

‎tests/docs/smoke-all/revealjs/brand-mode/brand-logo-alt.qmd‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
---
2+
title: brand-mode and revealjs
3+
format: revealjs
4+
brand:
5+
logo:
6+
images:
7+
sun:
8+
path: sun-face.png
9+
alt: sun face
10+
moon:
11+
path: moon-face.png
12+
alt: moon face
13+
medium:
14+
light: sun
15+
dark: moon
16+
color:
17+
foreground:
18+
light: '#222'
19+
dark: '#eee'
20+
background:
21+
light: '#eee'
22+
dark: '#222'
23+
typography:
24+
headings:
25+
color:
26+
light: '#429'
27+
dark: '#54e'
28+
_quarto:
29+
tests:
30+
revealjs:
31+
ensureHtmlElements:
32+
-
33+
- 'img[src="sun-face.png"][alt="sun face"]'
34+
-
35+
- 'img[src="moon-face.png"][alt="moon face"]'
36+
---
37+
38+
## Here's a slide
39+
40+
- in {{< meta brand-mode >}} mode!

‎tests/docs/smoke-all/revealjs/brand-mode/brand-logo-reverse-dark.qmd‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
---
2+
title: brand-mode and revealjs
3+
format: revealjs
4+
brand:
5+
logo:
6+
images:
7+
sun: sun-face.png
8+
moon: moon-face.png
9+
medium:
10+
light: sun
11+
dark: moon
12+
color:
13+
foreground:
14+
light: '#222'
15+
dark: '#eee'
16+
background:
17+
light: '#eee'
18+
dark: '#222'
19+
typography:
20+
headings:
21+
color:
22+
light: '#429'
23+
dark: '#54e'
24+
brand-mode: dark
25+
logo:
26+
light: moon
27+
dark: sun
28+
_quarto:
29+
tests:
30+
revealjs:
31+
ensureHtmlElements:
32+
-
33+
- 'img[src="sun-face.png"]'
34+
-
35+
- 'img[src="moon-face.png"]'
36+
---
37+
38+
## Here's a slide
39+
40+
- in {{< meta brand-mode >}} mode!

‎tests/docs/smoke-all/revealjs/brand-mode/brand-logo-reverse.qmd‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
---
2+
title: brand-mode and revealjs
3+
format: revealjs
4+
brand:
5+
logo:
6+
images:
7+
sun: sun-face.png
8+
moon: moon-face.png
9+
medium:
10+
light: sun
11+
dark: moon
12+
color:
13+
foreground:
14+
light: '#222'
15+
dark: '#eee'
16+
background:
17+
light: '#eee'
18+
dark: '#222'
19+
typography:
20+
headings:
21+
color:
22+
light: '#429'
23+
dark: '#54e'
24+
logo:
25+
light: moon
26+
dark: sun
27+
_quarto:
28+
tests:
29+
revealjs:
30+
ensureHtmlElements:
31+
-
32+
- 'img[src="moon-face.png"]'
33+
-
34+
- 'img[src="sun-face.png"]'
35+
---
36+
37+
## Here's a slide
38+
39+
- in {{< meta brand-mode >}} mode!

0 commit comments

Comments
 (0)