diff --git a/lib/custom_html.typ b/lib/custom_html.typ index 057c644..8d3e1e7 100644 --- a/lib/custom_html.typ +++ b/lib/custom_html.typ @@ -33,4 +33,3 @@ #let summary-card-details = html.elem.with("summary-card-details") #let summary-card-list = html.elem.with("summary-card-list") -#let tag-box = html.elem.with("tag-box") diff --git a/lib/html_head.typ b/lib/html_head.typ index 04fa55f..324221f 100644 --- a/lib/html_head.typ +++ b/lib/html_head.typ @@ -17,8 +17,6 @@ description: none, /// Author of the site for metadata, default to document.author author: none, - /// Tags describing the content of the page - tags: (), /// Additional stylesheet for the page: must be a list of url stylesheets: (), /// List of related sites for metadata @@ -40,11 +38,6 @@ // Only set the Referer header for out request to the same origin html.meta(name: "referrer", content: "same-origin") - // Tags - if tags.len() != 0 { - html.meta(name: "keywords", content: tags.join(", ")) - } - if icon != none { html.link(rel: "icon", type: "image/png", href: icon) } diff --git a/lib/main.typ b/lib/main.typ index 0f985f3..0a6db10 100644 --- a/lib/main.typ +++ b/lib/main.typ @@ -23,8 +23,6 @@ description: none, /// Author of the site for metadata, default to document.author author: none, - /// Tags describing the content of the page - tags: (), /// Additional stylesheet for the page: must be a list of url stylesheets: (), /// List of related sites for metadata @@ -55,7 +53,6 @@ site-name: site-name, description: description, author: author, - tags: tags, stylesheets: stylesheets, me-links: me-links ) diff --git a/lib/summary.typ b/lib/summary.typ index b149597..7596b9b 100644 --- a/lib/summary.typ +++ b/lib/summary.typ @@ -23,12 +23,10 @@ } summary-card-preview { - display: flex; - flex-direction: column; + display: block; width: 100%; img { - display: block; width: 100%; height: 100%; object-fit: contain; @@ -51,48 +49,20 @@ margin-top: auto; padding-top: 1em; } - - tag-box { - display: flex; - flex-wrap: wrap; - margin-top: 0.3em; - - .tag { - max-width: ; - overflow: hidden; - text-overflow: ellipsis; - display:inline-block; - white-space: nowrap; - - background-color: var(--color-bg-highlight); - margin: 0.1em; - padding-top: 0.1em; - padding-bottom: 0.1em; - padding-left: 0.4em; - padding-right: 0.4em; - border-radius: 1em; - - } - } - } } ``` chtml.summary-card({ - chtml.summary-card-preview({ + chtml.summary-card-preview( html.a(href: summ.template-args.url, summ.preview-image) - if summ.img-copyright != none { - html.small[Image: #sym.copyright #summ.img-copyright] - } - }) + ) chtml.summary-card-description({ heading(level: 2, html.a(href: summ.template-args.url, summ.document-args.title)) html.a(href: summ.template-args.url, summ.document-args.description) chtml.summary-card-details(summ.document-args.date.display()) - chtml.tag-box(for tag in summ.template-args.tags { html.span(class: ("tag",), "#" + tag) }) }) }) } @@ -109,16 +79,12 @@ /// Right now, this cannot be used for link preview because open graph expect an url for the image, and typst inline /// the images directly in the html file in base64. preview-image: none, - /// The copyright for the image - img-copyright: none, /// The author or authors of the page author: none, /// A description of the page description: none, /// The date of publication (or maybe update?) of the page. date: none, - /// Tags associated to the content of the page - tags: (), ) = { assert(type(url) == str, message: "summary() must have an url") assert(type(title) == str or type(title) == content, message: "summary() must have title") @@ -136,10 +102,8 @@ ), template-args: ( url: url, - tags: tags, ), preview-image: preview-image, - img-copyright: img-copyright, card: [] ) summ.card = gen_summary_card(summ) @@ -166,12 +130,7 @@ lang: "raw-css", ) chtml.summary-card-list(attrs: (class: class-name), { - for summ in summs.sorted(key: it => - -(it.document-args.date.day()-1 + 31 * ( - (it.document-args.date.month()-1) + - 12 * it.document-args.date.year() - )) - ) { + for summ in summs { summ.card } }) diff --git a/lib/theme_colors.typ b/lib/theme_colors.typ index 8f68ff2..3df786a 100644 --- a/lib/theme_colors.typ +++ b/lib/theme_colors.typ @@ -14,8 +14,7 @@ --color-button-shadow: light-dark(#888, #000); --color-button-focus: light-dark(#000, #FFF); - --color-bg-highlight: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05)); - --color-code-bg: var(--color-bg-highlight); + --color-code-bg: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05)); --color-bg-overlay: light-dark(rgba(255, 255, 255, 0.9), rgba(0, 0, 0, 0.9)); diff --git a/test_template/main.typ b/test_template/main.typ index 01354de..cca7e15 100644 --- a/test_template/main.typ +++ b/test_template/main.typ @@ -8,7 +8,6 @@ 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.", ), author: "Me!", - tags: ("test", "html/css", "typst"), description: "Test of the TTT template", date: datetime(year: 1942, month: 4, day: 1), ) @@ -165,23 +164,16 @@ thead { caption: [A Big Platypus!] ) -#let perm = (17, 6, 20, 19, 15, 5, 13, 11, 14, 12, 16, 10, 2, 3, 1, 9, 7, 4, 18, 8) #card-list( min-width: 200, - range(20).map(i => + range(1, 21).map(i => summary( url: "http://test.example.com", - title: "Card " + str(perm.at(i)), - tags: if perm.at(i) == 20 { - ("tag2", "tag5","loooooonnnnnnnnnnnnnng-tag","some-tag","some-other-tag") - } else { - (2, 3, 5, 7).filter(j => calc.rem(perm.at(i), j) == 0).map(j => "tag" + str(j)) - }, + title: "Card " + str(i), preview-image: summ.preview-image, - img-copyright: if calc.rem(i, 3) == 0 { [Histausse ] } else { none }, author: "Me!", description: lorem(10 * calc.rem(i * 123, 10)), - date: datetime(year: 2000, month: 12, day: perm.at(i)), + date: datetime(year: 2000, month: 12, day: i), ) ) )