repos / pico

post.page.tmpl

 1{{template "base" .}}
 2
 3{{define "title"}}{{.PageTitle}}{{end}}
 4
 5{{define "meta"}}
 6<meta property="og:type" content="website">
 7<meta property="og:site_name" content="{{.Site.Domain}}">
 8<meta property="og:url" content="{{.URL}}">
 9<meta property="og:title" content="{{.Title}}">
10<meta property="og:image:width" content="300" />
11<meta property="og:image:height" content="300" />
12<meta itemprop="image" content="https://{{.Site.Domain}}/card.png" />
13<meta property="og:image" content="https://{{.Site.Domain}}/card.png" />
14
15<meta property="twitter:card" content="summary">
16<meta property="twitter:url" content="{{.URL}}">
17<meta property="twitter:title" content="{{.Title}}">
18<meta name="twitter:image" content="https://{{.Site.Domain}}/card.png" />
19<meta name="twitter:image:src" content="https://{{.Site.Domain}}/card.png" />
20
21<link rel="stylesheet" href="/syntax.css" />
22{{end}}
23
24{{define "attrs"}}id="post"{{end}}
25
26{{define "body"}}
27<header>
28    <h1 class="text-2xl font-bold transform-none">{{.Title}}</h1>
29    <p class="font-bold m-0">
30      {{if .Unlisted}} <code>unlisted</code>{{end}}
31      <time datetime="{{.PublishAtISO}}">{{.PublishAt}}</time>
32      <span> &middot; <span>
33      <a href="{{.BlogURL}}">{{.BlogName}}</a>
34      <span> &middot; <span>
35      <a href="{{.RawURL}}">raw</a>
36    </p>
37    <p class="font-bold m-0">expires: {{.ExpiresAt}}</p>
38    <script>
39      function init() {
40        const btn = document.querySelector("#copy-btn");
41        const res = document.querySelector("#copy-result");
42        const text = "{{.Text}}";
43        btn.addEventListener("click", () => {
44          res.innerHtml = "";
45          navigator.clipboard.writeText(text)
46            .then(() => res.innerHTML = "success!");
47        })
48      }
49      document.addEventListener("DOMContentLoaded", init);
50    </script>
51</header>
52<main>
53    <div class="flex gap items-center">
54      <button id="copy-btn" class="btn" style="background-color: transparent;">copy</button>
55      <div id="copy-result" class=""></div>
56    </div>
57    <article>
58        {{.Contents}}
59    </article>
60</main>
61{{template "footer" .}}
62{{end}}