-
Notifications
You must be signed in to change notification settings - Fork 1
/
page.html.template
72 lines (59 loc) · 3.6 KB
/
page.html.template
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<html class="no-js h-full w-full overflow-y-auto" lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="icon" href="/favicon.svg"/>
<link rel="mask-icon" href="/favicon.svg" color="#D19069"/>
<link rel="apple-touch-icon" href="/apple-touch-icon.png"/>
<link rel="manifest" href="/manifest.json"/>
<title>{{{ title }}}</title>
<meta name="author" content="Kimmo Brunfeldt" />
<meta name="description" content="{{{ description }}}"/>
<meta name="keywords" content="{{{ keywords }}}"/>
<meta property="og:title" content="{{{ ogTitle }}}"/>
<meta property="og:description" content="{{{ description }}}"/>
<meta property="og:image" content="{{{ ogImage }}}"/>
<meta property="og:url" content="{{{ ogUrl }}}"/>
<link rel="alternate" type="application/rss+xml" title="RSS feed for kimmo.blog" href="/rss.xml" />
<script>
document.documentElement.classList.remove("no-js");
// Prevent FOUC on page load if user perfers dark mode
// This logic needs to be synced with App.tsx
var storedTheme;
try {
storedTheme = window.localStorage.getItem("theme")
} catch (e) {
// Ignore error
}
var osPreference = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
var theme = storedTheme === null ? osPreference : storedTheme;
if (theme === "dark") {
document.documentElement.classList.add("dark");
}
</script>
<!-- Needs to be loaded at start -->
<link rel="stylesheet" href="{{{ relativePathToRoot }}}styles.css" />
<!-- https://web.dev/defer-non-critical-css/ -->
<link rel="preload" href="{{{ relativePathToRoot }}}fonts.css" as="style" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link rel="stylesheet" href="{{{ relativePathToRoot }}}fonts.css" /></noscript>
<link rel="preload" href="{{{ relativePathToRoot }}}blobz.css" as="style" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link rel="stylesheet" href="{{{ relativePathToRoot }}}blobz.css" /></noscript>
<link rel="preload" href="https://use.typekit.net/jyf2raq.css" as="style" onload="this.onload=null;this.rel='stylesheet'" />
<noscript><link rel="stylesheet" href="https://use.typekit.net/jyf2raq.css" /></noscript>
{{{ headAfter }}}
</head>
<body class="h-full w-full text-gray-9 dark:text-gray-3 dark:bg-gray-9">
<noscript class="absolute px-2 py-1 top-0 right-0 bg-white dark:bg-gray-9">
<div class="flex flex-row items-center">
<svg focusable="false" class="h-4 w-4 fill-current text-warning-5" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7 4.5V5H8V4.5H7ZM8 4.49V3.99H7V4.49H8ZM8 11V7H7V11H8ZM8 4.5V4.49H7V4.5H8ZM6 8H7.5V7H6V8ZM6 11H9V10H6V11ZM7.5 1C11.0899 1 14 3.91015 14 7.5H15C15 3.35787 11.6421 3.57628e-07 7.5 0V1ZM1 7.5C1 3.91015 3.91015 1 7.5 1V0C3.35787 -3.57628e-07 3.57628e-07 3.35786 0 7.5H1ZM7.5 14C3.91015 14 1 11.0899 1 7.5H0C-3.57628e-07 11.6421 3.35786 15 7.5 15V14ZM7.5 15C11.6421 15 15 11.6421 15 7.5H14C14 11.0899 11.0899 14 7.5 14V15Z"/>
</svg>
<span class="pl-1 text-xs text-gray-6 dark:text-gray-4">Some parts of the site need JavaScript</span>
</div>
</noscript>
<div class="h-full w-full" id="react-root">{{{ htmlContent }}}</div>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Intl%2CrequestIdleCallback%2CURLSearchParams%2CURL%2CPromise"></script>
<script async type="module" src="{{{ hydrateScriptPath }}}"></script>
</body>
</html>