garden/mytemplate.html at trunk · quat1024/garden · GitHub

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
<!DOCTYPE html>
<html lang="en" class="system">
<head>
  <meta charset="utf-8">
  <title>$title$</title>
  <link rel="stylesheet" href="/styles.css?cbust=10">
  <meta name="generator" content="pandoc">
  <meta name="color-scheme" content="light dark">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
  <meta property="og:type" content="website"> <!-- it's like a website in here -->
  $if(title)$<meta property="og:title" content="$title$">$endif$
  $if(blurb)$<meta property="og:description" content="$blurb$">$endif$
  <meta property="theme-color" content="#950000">
  <meta name="fediverse:creator" content="@quat@woof.group">
</head>
<body>
<nav>
  <span id="notes-at-hsa"><a href="/">notes</a><span>@</span><a href="https://highlysuspect.agency">HSA</a></span> &ndash;
  <a href="/listing.html">listing</a>
  <a href="/blog/">blog</a>
  <a href="/search.html">search</a>
  <div class="flexgrow"></div>
  <div>
    colors:
    <select name="color-scheme-picker" id="color-scheme-picker">
      <option value="system">system&nbsp;</option>
      <option value="light">light&nbsp;</option>
      <option value="dark">dark&nbsp;</option>
    </select>
  </div>
  <script>
    const picker = document.getElementById("color-scheme-picker");
    document.documentElement.className = picker.value = localStorage.getItem("notes-colors") || "system";
    picker.addEventListener("change", e => {
      localStorage.setItem("notes-colors", document.documentElement.className = picker.value);
    });
  </script>
</nav>
<main id="notfooter">
$body$
</main>
<footer>
  <hr>
  Questions, feedback, corrections: <a href="mailto:quat@highlysuspect.agency">quat@highlysuspect.agency</a>
  $if(quat_filename)$
  <div id="view-source">
  <a href="https://github.com/quat1024/garden/blob/trunk/$quat_filename$">.md</a>
  </div>
  $endif$
</footer>
</body>
</html>