components.templ RawHistoryFolder
1// SPDX-License-Identifier: AGPL-3.0-or-later
2
3package web
4
5// Facts is a key/value block on an 11ch key column.
6templ Facts(facts []Fact) {
7 <dl class="kv">
8 for _, f := range facts {
9 <dt>{ f.Key }</dt>
10 @FactValue(f)
11 }
12 </dl>
13}
14
15// CloneBlock is a block of copyable shell lines; each has its own [copy]
16// button, whose label says "copied" for 1.5 s.
17templ CloneBlock(c Clone) {
18 <div class="clone" id={ c.ID }>
19 for _, line := range c.Lines {
20 <div class="clone-line">
21 <span class="mute" aria-hidden="true">$ </span><code>{ line }</code>
22 <button
23 type="button"
24 class="btn copy"
25 data-label="Copy"
26 aria-label={ "copy: " + line }
27 hx-on:click="navigator.clipboard?.writeText(closest('.clone-line').querySelector('code').textContent); this.textContent = 'Copied'; await timeout('1500ms'); this.textContent = this.dataset.label"
28 >Copy</button>
29 </div>
30 }
31 </div>
32}
33
34// HomeRow is one row of the home list. Its id is the target of SSE swaps.
35templ HomeRowView(r HomeRow) {
36 <tr id={ r.ID } data-cursor?={ r.Cursor }>
37 <td class="cur" aria-hidden="true"></td>
38 <td class="c-name">
39 <a href={ templ.SafeURL(r.Href) }>{ r.Name }</a>
40 if r.Fresh {
41 <span class="pill new">new push</span>
42 }
43 </td>
44 <td class="c-desc dim">{ r.Desc }</td>
45 <td class="c-when nowrap">
46 <time
47 if r.PushedAt != "" {
48 datetime={ r.PushedAt }
49 }
50 >{ r.Pushed }</time>
51 </td>
52 <td class="c-ref">{ r.Branch }</td>
53 </tr>
54}
55
56// Outline is the README outline; levels indent by 2ch, the h1 is bold.
57templ Outline(headings []Heading) {
58 <nav class="outline" aria-label="Outline">
59 for _, h := range headings {
60 <a class={ "l" + itoa(h.Level) } href={ templ.SafeURL("#" + h.ID) }>{ h.Text }</a>
61 }
62 </nav>
63}
64
65// ReadmeCard is a README in a card whose header names the file.
66templ ReadmeCard(r Readme) {
67 <section class="card readme" aria-labelledby="readme-h">
68 <h2 class="card-h" id="readme-h">
69 <span class="ico i-file" aria-hidden="true"></span>
70 { r.Name }
71 </h2>
72 @ReadmeView(r)
73 </section>
74}
75
76// ReadmeView is a rendered README. Its HTML comes from the Markdown
77// renderer, which drops raw HTML and filters URLs.
78templ ReadmeView(r Readme) {
79 <article class="prose" aria-label={ r.Name }>
80 if r.Note != "" {
81 <p class="dim">{ r.Note }</p>
82 } else {
83 @templ.Raw(r.HTML)
84 }
85 </article>
86}
87
88// CommitRows is a cursor table of commits: sha, subject with inline refs,
89// author, relative date (absolute in the title).
90templ CommitRows(rows []CommitRow) {
91 <table class="list commits" aria-label="Commits">
92 <tbody data-rows>
93 for _, c := range rows {
94 <tr
95 if c.ID != "" {
96 id={ c.ID }
97 }
98 data-cursor?={ c.Cursor }
99 >
100 <td class="cur" aria-hidden="true"></td>
101 <td class="c-sha mute">{ c.Short }</td>
102 <td class="c-subject">
103 <a href={ templ.SafeURL(c.CHref) }>{ c.Subject }</a>
104 if c.Merge {
105 <span class="pill">merge</span>
106 }
107 for _, b := range c.Branches {
108 <span class="pill">{ b }</span>
109 }
110 for _, t := range c.Tags {
111 <span class="pill tag"><span class="sr">tag </span>{ t }</span>
112 }
113 </td>
114 <td class="c-who dim">{ c.Author }</td>
115 <td class="c-when nowrap dim"><time datetime={ c.WhenAt } title={ c.WhenAt }>{ c.When }</time></td>
116 </tr>
117 }
118 </tbody>
119 </table>
120}