Skip to content

Commit 1f36a31

Browse files
kokickokic
committed
fix(typ): update auto-figure and math equation rendering for HTML target
1 parent 5736b51 commit 1f36a31

3 files changed

Lines changed: 111 additions & 75 deletions

File tree

‎featured-demo/trees/_lib/kodama.typ‎

Lines changed: 55 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,13 @@
2626
})
2727

2828
#let auto-frame(content) = compatibled-html(() => html.frame, () => content)
29-
#let auto-figure(content) = compatibled-html(
30-
() => html.figure,
31-
() => align(center, content), // main.css: `figure { text-align: center; }`
32-
)
29+
#let auto-figure(content) = with-target-check((export-target) => {
30+
if export-target == "html" {
31+
html.figure(content) // main.css: `figure { text-align: center; }`
32+
} else {
33+
align(center, content)
34+
}
35+
})
3336

3437
#let html-font-size = 15.525pt
3538

@@ -368,42 +371,57 @@
368371
set par(spacing: 1.5em)
369372
doc
370373
} else {
374+
// show math.equation.where(block: false): it => {
375+
// with-target-check(
376+
// (export-target) => {
377+
// if export-target == "html" {
378+
// let label = repr(it)
379+
// if label in equations-height-dict.final().keys() {
380+
// let height = equations-height-dict.final().at(label, default: none)
381+
// equations-height-dict.update(d => {
382+
// d.insert(label, height); d
383+
// })
384+
// let y-length = measure(bounded(it)).height
385+
// let shift = y-length - height
386+
// box(html.elem("span", attrs: (style: "vertical-align: -" + to-em(shift.pt()) + ";"), html.frame(bounded(it))))
387+
// } else {
388+
// box(html.frame(add-pin(it)))
389+
// }
390+
// } else {
391+
// it
392+
// }
393+
// },
394+
// )
395+
// }
396+
// show math.equation.where(block: true): it => {
397+
// with-target-check(
398+
// (export-target) => {
399+
// if export-target == "html" {
400+
// if is-inside-pin.get() {
401+
// html.frame(it)
402+
// } else {
403+
// html.elem("div", attrs: (style: "display: flex; justify-content: center; width: 100%; margin: 1em 0;"), html.frame(it))
404+
// }
405+
// } else {
406+
// it
407+
// }
408+
// },
409+
// )
410+
// }
411+
//
371412
show math.equation.where(block: false): it => {
372-
with-target-check(
373-
(export-target) => {
374-
if export-target == "html" {
375-
let label = repr(it)
376-
if label in equations-height-dict.final().keys() {
377-
let height = equations-height-dict.final().at(label, default: none)
378-
equations-height-dict.update(d => {
379-
d.insert(label, height); d
380-
})
381-
let y-length = measure(bounded(it)).height
382-
let shift = y-length - height
383-
box(html.elem("span", attrs: (style: "vertical-align: -" + to-em(shift.pt()) + ";"), html.frame(bounded(it))))
384-
} else {
385-
box(html.frame(add-pin(it)))
386-
}
387-
} else {
388-
it
389-
}
390-
},
391-
)
413+
if target() == "html" {
414+
html.elem("span", attrs: (role: "math"), html.frame(it))
415+
} else {
416+
it
417+
}
392418
}
393419
show math.equation.where(block: true): it => {
394-
with-target-check(
395-
(export-target) => {
396-
if export-target == "html" {
397-
if is-inside-pin.get() {
398-
html.frame(it)
399-
} else {
400-
html.elem("div", attrs: (style: "display: flex; justify-content: center; width: 100%; margin: 1em 0;"), html.frame(it))
401-
}
402-
} else {
403-
it
404-
}
405-
},
406-
)
420+
if target() == "html" {
421+
html.elem("figure", attrs: (role: "math"), html.frame(it))
422+
} else {
423+
it
424+
}
407425
}
408426
doc
409427
}

‎featured-demo/trees/index.typst‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
"taxon": "example", //
1212
"date": "October 12, 2025", //
1313
"author": "Anonymous",
14-
"0AFE": local("0AFE") // Alice
14+
"0AFE": local("0AFE"), // Alice
1515
))
1616

1717
#lorem(32) #local("./0AFF", text: [*Bob being linked*]).

‎src/include/kodama.typ‎

Lines changed: 55 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,13 @@
2626
})
2727

2828
#let auto-frame(content) = compatibled-html(() => html.frame, () => content)
29-
#let auto-figure(content) = compatibled-html(
30-
() => html.figure,
31-
() => align(center, content), // main.css: `figure { text-align: center; }`
32-
)
29+
#let auto-figure(content) = with-target-check((export-target) => {
30+
if export-target == "html" {
31+
html.figure(content) // main.css: `figure { text-align: center; }`
32+
} else {
33+
align(center, content)
34+
}
35+
})
3336

3437
#let html-font-size = 15.525pt
3538

@@ -368,42 +371,57 @@
368371
set par(spacing: 1.5em)
369372
doc
370373
} else {
374+
// show math.equation.where(block: false): it => {
375+
// with-target-check(
376+
// (export-target) => {
377+
// if export-target == "html" {
378+
// let label = repr(it)
379+
// if label in equations-height-dict.final().keys() {
380+
// let height = equations-height-dict.final().at(label, default: none)
381+
// equations-height-dict.update(d => {
382+
// d.insert(label, height); d
383+
// })
384+
// let y-length = measure(bounded(it)).height
385+
// let shift = y-length - height
386+
// box(html.elem("span", attrs: (style: "vertical-align: -" + to-em(shift.pt()) + ";"), html.frame(bounded(it))))
387+
// } else {
388+
// box(html.frame(add-pin(it)))
389+
// }
390+
// } else {
391+
// it
392+
// }
393+
// },
394+
// )
395+
// }
396+
// show math.equation.where(block: true): it => {
397+
// with-target-check(
398+
// (export-target) => {
399+
// if export-target == "html" {
400+
// if is-inside-pin.get() {
401+
// html.frame(it)
402+
// } else {
403+
// html.elem("div", attrs: (style: "display: flex; justify-content: center; width: 100%; margin: 1em 0;"), html.frame(it))
404+
// }
405+
// } else {
406+
// it
407+
// }
408+
// },
409+
// )
410+
// }
411+
//
371412
show math.equation.where(block: false): it => {
372-
with-target-check(
373-
(export-target) => {
374-
if export-target == "html" {
375-
let label = repr(it)
376-
if label in equations-height-dict.final().keys() {
377-
let height = equations-height-dict.final().at(label, default: none)
378-
equations-height-dict.update(d => {
379-
d.insert(label, height); d
380-
})
381-
let y-length = measure(bounded(it)).height
382-
let shift = y-length - height
383-
box(html.elem("span", attrs: (style: "vertical-align: -" + to-em(shift.pt()) + ";"), html.frame(bounded(it))))
384-
} else {
385-
box(html.frame(add-pin(it)))
386-
}
387-
} else {
388-
it
389-
}
390-
},
391-
)
413+
if target() == "html" {
414+
html.elem("span", attrs: (role: "math"), html.frame(it))
415+
} else {
416+
it
417+
}
392418
}
393419
show math.equation.where(block: true): it => {
394-
with-target-check(
395-
(export-target) => {
396-
if export-target == "html" {
397-
if is-inside-pin.get() {
398-
html.frame(it)
399-
} else {
400-
html.elem("div", attrs: (style: "display: flex; justify-content: center; width: 100%; margin: 1em 0;"), html.frame(it))
401-
}
402-
} else {
403-
it
404-
}
405-
},
406-
)
420+
if target() == "html" {
421+
html.elem("figure", attrs: (role: "math"), html.frame(it))
422+
} else {
423+
it
424+
}
407425
}
408426
doc
409427
}

0 commit comments

Comments
 (0)