Skip to content

Commit 50fdcb0

Browse files
typst: allow customization of light and dark logos
the main point of this is to delete the final remaining independent implementation of logo resolution and have everything be consistent with the other formats but yeah, also so that you can customize light and dark logos
1 parent 5ca8f57 commit 50fdcb0

16 files changed

+261
-44
lines changed

news/changelog-1.8.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ All changes included in 1.8:
5151
- ([#12739](https://github.com/quarto-dev/quarto-cli/pull/12739)): Remove unused variable `heading-background-color` and `heading-decoration` from Typst's templates. They are leftover from previous change, and not part of Brand.yml schema for typography of headings.
5252
- ([#12815](https://github.com/quarto-dev/quarto-cli/issues/12815)): Do not crash when floats have no content.
5353
- ([#13119](https://github.com/quarto-dev/quarto-cli/pull/13119)): Expose `brand.logo` metadata as Typst dictionaries.
54+
- (): Allow customization of light and dark logos at document level, consistent with other formats.
5455

5556
### `beamer`
5657

src/format/typst/format-typst.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
kFigFormat,
1515
kFigHeight,
1616
kFigWidth,
17+
kLogo,
1718
kNumberSections,
1819
kSectionNumbering,
1920
kShiftHeadingLevelBy,
@@ -30,6 +31,8 @@ import {
3031
import { formatResourcePath } from "../../core/resources.ts";
3132
import { createFormat } from "../formats-shared.ts";
3233
import { hasLevelOneHeadings as hasL1Headings } from "../../core/lib/markdown-analysis/level-one-headings.ts";
34+
import { LogoLightDarkSpecifier } from "../../resources/types/schema-types.ts";
35+
import { resolveLogo } from "../../core/brand/brand.ts";
3336

3437
export function typstFormat(): Format {
3538
return createFormat("Typst", "pdf", {
@@ -78,6 +81,14 @@ export function typstFormat(): Format {
7881
pandoc[kShiftHeadingLevelBy] = -1;
7982
}
8083

84+
const brand = format.render.brand;
85+
const logoSpec = format.metadata[kLogo] as LogoLightDarkSpecifier;
86+
format.metadata[kLogo] = resolveLogo(brand, logoSpec, [
87+
"small",
88+
"medium",
89+
"large",
90+
]);
91+
8192
// force columns to wrap and move any 'columns' setting to metadata
8293
const columns = format.pandoc[kColumns];
8394
if (columns) {

src/resources/filters/quarto-post/typst-brand-yaml.lua

Lines changed: 4 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -251,25 +251,11 @@ function render_typst_brand_yaml()
251251
end
252252
-- logo
253253
local logo = param('logo')
254-
local logoOptions = {}
255-
local foundLogo = null
256-
if logo then
257-
if type(logo) == 'string' then
258-
foundLogo = _quarto.modules.brand.get_logo(brandMode, logo) or {path=logo}
259-
elseif type(logo) == 'table' then
260-
for k, v in pairs(logo) do
261-
logoOptions[k] = v
262-
end
263-
if logo.path then
264-
foundLogo = _quarto.modules.brand.get_logo(brandMode, logo.path) or {path=logo}
265-
end
266-
end
267-
end
268-
if not foundLogo and brand and brand.processedData and brand.processedData.logo then
269-
foundLogo = _quarto.modules.brand.get_logo(brandMode, 'medium')
270-
or _quarto.modules.brand.get_logo(brandMode, 'small')
271-
or _quarto.modules.brand.get_logo(brandMode, 'large')
254+
if not next(logo) then
255+
meta.logo = nil
272256
end
257+
local logoOptions = {}
258+
local foundLogo = logo and logo[brandMode]
273259
if foundLogo then
274260
logoOptions.path = foundLogo.path
275261
logoOptions.alt = foundLogo.alt
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
- name: logo
22
schema:
3-
ref: logo-specifier-path-optional
3+
ref: logo-light-dark-specifier
44
tags:
55
formats: [typst]
66
description: "The logo image."
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
7+
brand:
8+
logo:
9+
images:
10+
sun:
11+
path: sun-face.png
12+
alt: sun face
13+
moon:
14+
path: moon-face.png
15+
alt: moon face
16+
medium:
17+
light: sun
18+
dark: moon
19+
color:
20+
foreground:
21+
light: '#222'
22+
dark: '#eee'
23+
background:
24+
light: '#eee'
25+
dark: '#222'
26+
typography:
27+
headings:
28+
color:
29+
light: '#429'
30+
dark: '#54e'
31+
brand-mode: dark
32+
logo:
33+
light:
34+
path: sun
35+
alt: SUN
36+
dark:
37+
path: moon
38+
alt: MOON
39+
_quarto:
40+
tests:
41+
revealjs:
42+
ensureHtmlElements:
43+
-
44+
- 'img[src="moon-face.png"][alt="MOON"]'
45+
-
46+
- 'img[src="sun-face.png"]'
47+
typst:
48+
ensureTypstFileRegexMatches:
49+
-
50+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("moon-face\.png", width: 1\.5in, alt: "MOON"\)\)'
51+
-
52+
- 'background.*sun-face\.png'
53+
---
54+
55+
## Here we go
56+
57+
- in {{< meta brand-mode >}} mode!

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

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
---
2-
title: brand-mode and revealjs
3-
format: revealjs
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
47
brand:
58
logo:
69
images:
@@ -40,8 +43,14 @@ _quarto:
4043
- 'img[src="sun-face.png"][alt="SUN"]'
4144
-
4245
- 'img[src="moon-face.png"][alt="MOON"]'
46+
typst:
47+
ensureTypstFileRegexMatches:
48+
-
49+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("sun-face\.png", width: 1\.5in, alt: "SUN"\)\)'
50+
-
51+
- 'background.*moon-face\.png'
4352
---
4453

45-
## Here's a slide
54+
## Here we go
4655

47-
- in {{< meta brand-mode >}} mode!
56+
- in default `brand-mode`!

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

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
---
2-
title: brand-mode and revealjs
3-
format: revealjs
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
47
brand:
58
logo:
69
images:
@@ -33,8 +36,14 @@ _quarto:
3336
- 'img[src="sun-face.png"][alt="sun face"]'
3437
-
3538
- 'img[src="moon-face.png"][alt="moon face"]'
39+
typst:
40+
ensureTypstFileRegexMatches:
41+
-
42+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("sun-face\.png", width: 1\.5in, alt: "sun face"\)\)'
43+
-
44+
- 'background.*moon-face\.png'
3645
---
3746

38-
## Here's a slide
47+
## Here we go
3948

40-
- in {{< meta brand-mode >}} mode!
49+
- in default `brand-mode`!
Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
---
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
7+
brand:
8+
logo:
9+
images:
10+
sun:
11+
path: sun-face.png
12+
alt: sun face
13+
moon:
14+
path: moon-face.png
15+
alt: moon face
16+
medium:
17+
dark: moon
18+
color:
19+
foreground:
20+
light: '#222'
21+
dark: '#eee'
22+
background:
23+
light: '#eee'
24+
dark: '#222'
25+
typography:
26+
headings:
27+
color:
28+
light: '#429'
29+
dark: '#54e'
30+
brand-mode: light
31+
_quarto:
32+
tests:
33+
revealjs:
34+
ensureHtmlElements:
35+
-
36+
- 'img[src="moon-face.png"][alt="moon face"]'
37+
-
38+
- 'img[src="sun-face.png"][alt="sun face"]'
39+
typst:
40+
ensureTypstFileRegexMatches:
41+
-
42+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("moon-face\.png", width: 1\.5in, alt: "moon face"\)\)'
43+
-
44+
- 'background.*sun-face\.png'
45+
---
46+
47+
## Here we go
48+
49+
- in default `brand-mode`!
Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
---
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
7+
brand:
8+
logo:
9+
images:
10+
sun:
11+
path: sun-face.png
12+
alt: sun face
13+
moon:
14+
path: moon-face.png
15+
alt: moon face
16+
medium:
17+
light: sun
18+
color:
19+
foreground:
20+
light: '#222'
21+
dark: '#eee'
22+
background:
23+
light: '#eee'
24+
dark: '#222'
25+
typography:
26+
headings:
27+
color:
28+
light: '#429'
29+
dark: '#54e'
30+
brand-mode: dark
31+
_quarto:
32+
tests:
33+
revealjs:
34+
ensureHtmlElements:
35+
-
36+
- 'img[src="sun-face.png"][alt="sun face"]'
37+
-
38+
- 'img[src="moon-face.png"][alt="moon face"]'
39+
typst:
40+
ensureTypstFileRegexMatches:
41+
-
42+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("sun-face\.png", width: 1\.5in, alt: "sun face"\)\)'
43+
-
44+
- 'background.*moon-face\.png'
45+
---
46+
47+
## Here we go
48+
49+
- in default `brand-mode`!

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

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
---
2-
title: brand-mode and revealjs
3-
format: revealjs
2+
title: brand-mode and logos
3+
format:
4+
revealjs: default
5+
typst:
6+
keep-typ: true
47
brand:
58
logo:
69
images:
@@ -33,8 +36,14 @@ _quarto:
3336
- 'img[src="sun-face.png"]'
3437
-
3538
- 'img[src="moon-face.png"]'
39+
typst:
40+
ensureTypstFileRegexMatches:
41+
-
42+
- 'background: align\(left\+top, box\(inset: 0.75in, image\("sun-face\.png", width: 1\.5in\)\)'
43+
-
44+
- 'background.*moon-face\.png'
3645
---
3746

38-
## Here's a slide
47+
## Here we go
3948

4049
- in {{< meta brand-mode >}} mode!

0 commit comments

Comments
 (0)