repos / pico

pico services - prose.sh, pastes.sh, imgs.sh, feeds.sh, pgs.sh
git clone https://github.com/picosh/pico.git

pico / prose / html
Eric Bower · 08 Apr 24

read.page.tmpl

 1{{template "base" .}}
 2
 3{{define "title"}}prose.sh -- A blog platform for hackers{{end}}
 4
 5{{define "meta"}}
 6<meta name="description" content="A blog platform for hackers" />
 7<link rel="alternate" href="/rss" type="application/rss+xml" title="RSS feed for prose.sh" />
 8<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
 9
10<meta property="og:type" content="website">
11<meta property="og:site_name" content="{{.Site.Domain}}">
12<meta property="og:url" content="https://{{.Site.Domain}}">
13<meta property="og:title" content="{{.Site.Domain}}">
14<meta property="og:description" content="A blog platform for hackers">
15
16<meta name="twitter:card" content="summary" />
17<meta property="twitter:url" content="https://{{.Site.Domain}}">
18<meta property="twitter:title" content="{{.Site.Domain}}">
19<meta property="twitter:description" content="A blog platform for hackers">
20<meta name="twitter:image" content="https://{{.Site.Domain}}/card.png" />
21<meta name="twitter:image:src" content="https://{{.Site.Domain}}/card.png" />
22
23<meta property="og:image:width" content="300" />
24<meta property="og:image:height" content="300" />
25<meta itemprop="image" content="https://{{.Site.Domain}}/card.png" />
26<meta property="og:image" content="https://{{.Site.Domain}}/card.png" />
27{{end}}
28
29{{define "attrs"}}{{end}}
30
31{{define "body"}}
32<header class="text-center">
33    <h1 class="text-2xl font-bold">prose.sh</h1>
34    <p class="text-lg">A blog platform for hackers</p>
35    <div>
36      <a href="https://pico.sh/prose" class="btn-link mt inline-block">LEARN MORE</a>
37    </div>
38    <hr />
39</header>
40<main>
41    <div class="flex items-center">
42        <div class="font-italic text-sm post-date">popular tags</div>
43        <div class="flex-1">
44        {{range .Tags}}
45        <span class="text-md"><a href="/read?tag={{.}}">#{{.}}</a></span>
46        {{end}}
47        </div>
48    </div>
49    {{if .HasFilter}}<a href="/read">clear filter</a>{{end}}
50
51    <div class="mt">
52        {{if .PrevPage}}<a href="{{.PrevPage}}">prev</a>{{else}}<span class="text-grey">prev</span>{{end}}
53        {{if .NextPage}}<a href="{{.NextPage}}">next</a>{{else}}<span class="text-grey">next</span>{{end}}
54    </div>
55
56    {{range .Posts}}
57    <article class="my-2">
58        <div class="flex items-center">
59            <time datetime="{{.PublishAtISO}}" class="font text-sm post-date">{{.PublishAt}}</time>
60            <div class="flex-1">
61                <span class="text-md"><a href="{{.URL}}">{{.Title}}</a></span>
62                <address class="text-sm inline">
63                    <a href="{{.BlogURL}}" class="link-grey">({{.Username}})</a>
64                </address>
65            </div>
66        </div>
67    </article>
68    {{end}}
69</main>
70{{template "marketing-footer" .}}
71{{end}}