histausse/typst-web-template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

decouple logo and icon

Browse source
This commit is contained in:
Jean-Marie 'Histausse' Mineau 2026-03-18 14:08:16 +01:00
parent 4693003806
commit 07a0392d8c
Signed by: histausse
GPG key ID: B66AEEDA9B645AD2
5 changed files with 18 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

8
lib/html_body.typ
View file

@ -7,10 +7,8 @@
#let html_body( #let html_body(
/// The visible header of the page /// The visible header of the page
header: [], header: [],
/// Logo of the site, must be an url (TODO) /// Logo of the site
logo, logo: none,
/// Logo alt-text
logo_alt,
/// Navigation menu content, css style expect a list /// Navigation menu content, css style expect a list
menu: none, menu: none,
body body
@ -81,7 +79,7 @@
// typst `image` function embed the image in the html, which is not great, // typst `image` function embed the image in the html, which is not great,
// and logo is also used for icon, so it's necessarily an url // and logo is also used for icon, so it's necessarily an url
if logo != none { if logo != none {
html.img(src: logo, alt: logo_alt, height: 100) // TODO: height bad logo
} }
}) })
body body

2
lib/html_head.typ
View file

@ -8,7 +8,7 @@
/// Title of the page /// Title of the page
title, title,
/// Path to the icon (TODO: /!\ must be an url, typst image not yet supported) /// Path to the icon (TODO: /!\ must be an url, typst image not yet supported)
icon, icon: none,
/// Type of the page for open-graph data /// Type of the page for open-graph data
og-type: "website", og-type: "website",
/// Name of the site for metadata of the page /// Name of the site for metadata of the page

16
lib/main.typ
View file

@ -7,10 +7,8 @@
#let webpage( #let webpage(
/// Page url /// Page url
url, url,
/// Page logo, also used for icon, so it *needs* to be path (TODO: fix when typst support multi-file out) /// Logo in page header
logo, logo: none,
/// Alt-text for the log
logo-alt,
/// Title of the page, default to document.title /// Title of the page, default to document.title
title: none, title: none,
/// Page header /// Page header
@ -18,6 +16,8 @@
/// Use only for html 'lang' attribute. /// Use only for html 'lang' attribute.
lang: "en", lang: "en",
//-- <head> only args -- //-- <head> only args --
/// Website icon, *needs* to be path (TODO: fix when typst support multi-file out)
icon: none,
/// Type of the page for open-graph data /// Type of the page for open-graph data
og-type: "website", og-type: "website",
/// Name of the site for metadata of the page /// Name of the site for metadata of the page
@ -31,7 +31,8 @@
/// List of related sites for metadata /// List of related sites for metadata
me-links: (), me-links: (),
//-- Body -- //-- Body --
/// Navigation menu content, css style expect a list /// Navigation menu content, css style expect a list of links, but it can
/// be anything
menu: none, menu: none,
/// Body of the page /// Body of the page
body body
@ -41,7 +42,7 @@
html_head( html_head(
url, url,
title, title,
logo, icon: icon,
og-type: og-type, og-type: og-type,
site-name: site-name, site-name: site-name,
description: description, description: description,
@ -50,8 +51,7 @@
me-links: me-links me-links: me-links
) )
html_body( html_body(
logo, logo: logo,
logo-alt,
header: header, header: header,
menu: menu, menu: menu,
body body

8
test_template/main.typ
View file

@ -8,8 +8,11 @@
#show: webpage.with( #show: webpage.with(
"http://test.example.com", "http://test.example.com",
"https://jean-marie.mineau.eu/website_assets/platypus.png", logo: image(
"A drawing of a blue-ish round-ish platypus with big eyes, holding a laptop. This platypus is quite cute, but I might be biased.", "./platypus.png",
alt: "A drawing of a blue-ish round-ish platypus with big eyes, holding a laptop. This platypus is quite cute, but I might be biased.",
height: 100pt,
),
header: [ header: [
= Test TeTyTe = Test TeTyTe
Hello World! Hello World!
@ -27,6 +30,7 @@
- #link("example.com")[War] - #link("example.com")[War]
], ],
site-name: "TTT", site-name: "TTT",
icon: "https://jean-marie.mineau.eu/website_assets/platypus.png",
) )

BIN
test_template/platypus.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 344 KiB