- # leading output
- $header{content_type} = "text/html; charset=$meta->{charset}";
- print <<"EOT";
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
- "http://www.w3.org/TR/html4/loose.dtd">
-<html lang="en">
-
-<head>
-<meta http-equiv="content-type" content="$header{content_type}">
-<title>$meta->{title}</title>
-<meta name="description" content="$meta->{description}">
-<meta name="keywords" content="$meta->{keywords}">
-<link rel="icon" type="image/png" href="/clip.png">
-EOT
- print stylesheet(@$_), "\n" for $meta->{stylesheet} || ();
- print $_, "\n" for $meta->{raw} || ();
- print qq{</head>\n\n<body id="$file">\n};
+ $meta->{canonical} //= "/$file" . ($Request ne '' && "/$Request");
+ if (my $url = $meta->{canonical}) {
+ $url = "https://sheet.shiar.nl$url";
+ push @{ $meta->{raw} }, qq(<link rel="canonical" href="$url" />);
+ }
+
+ PLP_START {
+ # leading output
+ say '<!DOCTYPE html>';
+ my $rootattr = '';
+ $rootattr .= qq( class="s-$_") for $meta->{stylesheet} || ();
+ say qq(<html lang="$meta->{lang}"$rootattr>);
+ say '';
+ say '<head>';
+ say sprintf '<meta http-equiv="content-type" content="%s">', $_
+ for $header{content_type};
+ say sprintf '<title>%s</title>', $meta->{title};
+ say sprintf '<meta name="description" content="%s">', EscapeHTML($_)
+ for join(' ', @{ $meta->{description} // [] }) || ();
+ say sprintf '<meta name="keywords" content="%s">', EscapeHTML($_)
+ for join(', ', @{ $meta->{keywords} // [] }) || ();
+ say '<meta name="viewport" content="width=device-width, initial-scale=1">';
+ say '<link rel="icon" type="image/png" href="/clip.png">';
+ say for map { @{$_} } $meta->{raw} || ();
+ say '<meta name="robots" content="noindex">' if $Dev;
+ say "<script>$_</script>" for join($/,
+ "docroot = document.documentElement;",
+ "if (docroot.className == '') {",
+ "new Map([",
+ "['s-mono','(monochrome)'],",
+ "['s-dark','(prefers-color-scheme: dark)'],",
+ "['s-circus','(prefers-contrast: more)'],",
+ "]).forEach((q,c) => {",
+ "if (m = window.matchMedia(q))",
+ "(m.onchange = e => docroot.classList.toggle(c, e.matches))(m)",
+ "})",
+ "}",
+ );
+ say '</head>';
+ say '';
+ say sprintf '<body id="%s">', $file;
+
+ # development version indicator
+ printf '<p style="%s">beta</p>', join('; ',
+ 'position: fixed',
+ 'right: 1em',
+ 'opacity: .5',
+ 'border: 1ex solid red',
+ 'border-width: 1ex 0',
+ 'z-index: 1',
+ 'background: inherit',
+ ) if $Dev;
+ };