sourcehypertextviewslatbslayout.pug

doctype html

include latbs-mixins.pug
include ../comments.pug

block presets
	- let snCounter = (x) => `${x}`
	- let rootAttrs = {}
	- let langOverride = false
	- let hasComments = true
	- let commentSubtitle = null
	- let hero = false
	- let heroAlt = false
	- let heroCaption = false
	- let crumbs = []

html(lang=`${langOverride && (langOverride.match(/^[a-z]+/)[0] == lang.match(/^[a-z]+/)[0]) ? langOverride : grimm.dict[lang].meta.code}`)&attributes(rootAttrs)
	head
		block head
			meta(charset="utf-8")
			meta(name="viewport", content="width=device-width, initial-scale=1.0")
			block title
				title #{title} | #{tr('latbs.header.siteName.title')}
			link(rel="icon", href="/latbs/media/favicon.webp")
			link(rel="alternate" type="application/rss+xml" title="The Satyrs’ Forest 🍇 (changelog)" href="/new/feed.xml")
			link(rel="alternate" type="application/rss+xml" title="The Garden 🌿 (blog)" href="/garden/feed")
			block cosmetics
				link(href="/cosmetics/style.css", rel="stylesheet")
				link(href="/cosmetics/comments.css", rel="stylesheet")
				link(href="/cosmetics/sidenotes.css", rel="stylesheet")
				link(href="/latbs/belka.css", rel="stylesheet")
				script(src="/cosmetics/script.js")
				script(src="/cosmetics/sidenotes.js")
				script(src="/latbs/strelka.js")
			block og
				meta(property="og:url", content=`https://satyrs.eu/${slug}`)
				meta(property="og:type", content="website")
				meta(property="og:title", content=title )
				if hero
					meta(property="og:image", content=`https://satyrs.eu/latbs/media/${hero}`)
				if heroAlt
					meta(property="og:image:alt", content=`${heroAlt}`)
				meta(property="og:site_name", content=`${tr('latbs.header.siteName.title')}`)
				meta(property="og:locale", content=`${(langOverride && (langOverride.match(/^[a-z]+/)[0] == lang.match(/^[a-z]+/)[0]) ? langOverride : grimm.dict[lang].meta.code).replace("-","_")}`)
	body(class=category)
		#body-container
			header#desktop-header
				h1: a(href="/latbs"): img.site-logo(src=`/latbs/logotype_${lang}_path_white.svg` alt=tr('latbs.header.siteName.title'))
				.site-header-fiddlybits
					if crumbs.some(el => el.url == "mars")
						.site-header-yearspan -21 – 286
					else
						.site-header-yearspan 1980 – 2558
					.site-header-slogan(lang="grc" data-latin="Πρὸς τἄστρα ἵν’ ἀνθῶμεν" data-local=tr("latbs.header.translation")) Πρὸς τἄστρα ἵν’ ἀνθῶμεν
			header#mobile-header
				h1: a(href="/latbs"): img.site-logo(src=`/latbs/logotype_${lang}_path_white.svg` alt=tr('latbs.header.siteName.title'))
				a.menu-button(href="#open-menu") ☰ #{tr('latbs.header.menu')}
			nav.meta#open-menu
				include sidebar.pug
				div
				a(href="#")
			article#article
				header.article-header
					block heading
						h1
							if supertitle
								span.supertitle= supertitle
							|  #{title} 
							if subtitle
								span.subtitle= subtitle
					.header-marginalia
						ul.tag-list
							li: a(href=`/latbs/${category}`)= tr(`latbs.category.${category}`)
							each crumb in crumbs
								li: a(href=`/latbs/${crumb.url}`)!= crumb.text
						if pageCreated
							if pageUpdated
								.timespan= tr('latbs.timeRange')(grimm.date.ce(lang, pageCreated, 3, {month: "short"}), grimm.date.ce(lang, pageUpdated, 3, {month: "short"}))
							else
								.timespan= grimm.date.ce(lang, pageCreated, 3, {month: "short"})
					if hero
						figure.hero-image
							img(src=`/latbs/media/${hero}` alt=heroAlt)
							if heroCaption
								figcaption!= heroCaption
				main
					block content
						p Article goes here
					if hasComments
						+comments("the-comments", commentSubtitle)
					div#cc0-notice: small!= tr("latbs.publicDomain")
		aside#sidenotes