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

add footer

Browse source
This commit is contained in:
Jean-Marie 'Histausse' Mineau 2026-03-18 14:33:31 +01:00
parent 9cefd6525a
commit 3e18a85d26
Signed by: histausse
GPG key ID: B66AEEDA9B645AD2
3 changed files with 39 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

28
lib/html_body.typ
View file

@ -7,6 +7,8 @@
#let html_body( #let html_body(
/// The visible header of the page /// The visible header of the page
header: none, header: none,
/// The footer of the page
footer: none,
/// Logo of the site /// Logo of the site
logo: none, logo: none,
/// Navigation menu content, css style expect a list /// Navigation menu content, css style expect a list
@ -15,7 +17,14 @@
) = { ) = {
theme-colors-css theme-colors-css
```raw-css ```raw-css
html, body {
height: 100%;
margin: 0;
}
site-wrapper { site-wrapper {
height: 100%;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
width: 100%; width: 100%;
@ -33,6 +42,8 @@
} }
site-container { site-container {
display: flex;
flex-direction: column;
width: 1050px; width: 1050px;
padding: 0 20px; padding: 0 20px;
@ -45,6 +56,16 @@
border-bottom: solid 1px var(--color-border); border-bottom: solid 1px var(--color-border);
margin-top: 15px; margin-top: 15px;
} }
main {
flex: 1;
}
footer {
border-top: solid 1px var(--color-border);
padding: 15px 5px;
margin-top: 15px;
}
} }
code-block { code-block {
@ -80,7 +101,12 @@
logo logo
}) })
} }
body
html.main(body)
if footer != none {
html.footer(footer)
}
}) })
}) })
}) })

11
lib/main.typ
View file

@ -7,12 +7,8 @@
#let webpage( #let webpage(
/// Page url /// Page url
url, url,
/// Logo in page header
logo: none,
/// Title of the page, default to document.title /// Title of the page, default to document.title
title: none, title: none,
/// Page header
header: none,
/// Use only for html 'lang' attribute. /// Use only for html 'lang' attribute.
lang: "en", lang: "en",
//-- <head> only args -- //-- <head> only args --
@ -34,6 +30,12 @@
/// Navigation menu content, css style expect a list of links, but it can /// Navigation menu content, css style expect a list of links, but it can
/// be anything /// be anything
menu: none, menu: none,
/// Logo in page header
logo: none,
/// Page header
header: none,
/// Page footer
footer: none,
/// Body of the page /// Body of the page
body body
) = { ) = {
@ -53,6 +55,7 @@
html_body( html_body(
logo: logo, logo: logo,
header: header, header: header,
footer: footer,
menu: menu, menu: menu,
body body
) )

6
test_template/main.typ
View file

@ -17,6 +17,10 @@
= Test TeTyTe = Test TeTyTe
Hello World! Hello World!
], ],
footer: [
#sym.copyright 2026 Histausse
Please don't train AI on my stuff without explicit permission
],
menu: [ menu: [
- #link("example.com")[Hello Void!] - #link("example.com")[Hello Void!]
- #link("example.com")[Demons] - #link("example.com")[Demons]
@ -34,7 +38,7 @@
) )
#lorem(200) #lorem(400)
Test, `this is not a code block`, end test. Test, `this is not a code block`, end test.