main
  1{{- /*gotype: mokhan.ca/xlgmokha/gitmal/pkg/templates.CommitParams*/ -}}
  2{{- define "head" -}}
  3<style>
  4  h1 code {
  5    border-radius: var(--border-radius);
  6    background: var(--c-bg-alt);
  7    padding: 4px 8px;
  8    font-family: var(--font-family-mono), monospace;
  9    font-weight: 500;
 10  }
 11  .commit {
 12    display: flex;
 13    flex-direction: column;
 14    gap: 16px;
 15    margin-bottom: 16px;
 16  }
 17  .commit-info {
 18    display: flex;
 19    flex-direction: row;
 20    gap: 8px;
 21    align-items: flex-end;
 22  }
 23  .commit-author {
 24    color: var(--c-text-1);
 25    font-weight: 600;
 26    min-width: 0;
 27    overflow-wrap: break-word;
 28  }
 29  .commit-date {
 30    color: var(--c-text-2);
 31    font-size: 12px;
 32    font-family: var(--font-family-mono), monospace;
 33  }
 34  .commit-message {
 35    border: 1px solid var(--c-border);
 36    border-radius: var(--border-radius);
 37    padding: 16px;
 38  }
 39  .ref-badges {
 40    display: inline-flex;
 41    gap: 6px;
 42    margin-left: 8px;
 43  }
 44  .badge {
 45    font-size: 12px;
 46    color: var(--c-text-2);
 47    border: 1px solid var(--c-border);
 48    padding: 2px 6px;
 49    border-radius: 999px;
 50    white-space: nowrap;
 51  }
 52  .commit-subject {
 53    font-size: 16px;
 54    font-weight: 600;
 55    line-height: 1.3;
 56    hyphens: auto;
 57  }
 58  .commit-body {
 59    margin-top: 16px;
 60    white-space: pre-wrap;
 61    line-height: 1.5;
 62    hyphens: auto;
 63  }
 64  .commit-subinfo {
 65    display: flex;
 66    flex-direction: row;
 67    gap: 16px;
 68    justify-content: space-between;
 69  }
 70  .commit-layout {
 71    display: grid;
 72    grid-template-columns: 1fr;
 73    gap: 16px;
 74  }
 75  @media (min-width: 960px) {
 76    .commit-layout {
 77      grid-template-columns: 300px 1fr;
 78      align-items: start;
 79    }
 80    .files-tree {
 81      position: sticky;
 82      top: 16px;
 83    }
 84    .files-tree-content {
 85      max-height: calc(100vh - var(--header-height) - 40px);
 86      overflow: auto;
 87    }
 88  }
 89  .files-tree {
 90    border: 1px solid var(--c-border);
 91    border-radius: var(--border-radius);
 92  }
 93  .files-tree-header {
 94    display: flex;
 95    flex-direction: row;
 96    align-items: center;
 97    padding-inline: 16px;
 98    height: var(--header-height);
 99    border-bottom: 1px solid var(--c-border);
100    border-top-left-radius: var(--border-radius);
101    border-top-right-radius: var(--border-radius);
102    background: var(--c-bg-alt);
103    font-size: 14px;
104    font-weight: 600;
105  }
106  .files-tree-content {
107    display: block;
108    padding-block: 6px;
109  }
110  .tree .children {
111    margin-left: 16px;
112    border-left: 1px dashed var(--c-border);
113  }
114  .tree .node {
115    display: flex;
116    align-items: center;
117    gap: 8px;
118    padding: 10px 16px;
119  }
120  .tree .file-name {
121    flex: 1;
122    font-weight: 500;
123    color: var(--c-text-1);
124    cursor: pointer;
125  }
126  .tree .file-name:hover {
127    color: var(--c-brand-2);
128    text-decoration: underline;
129  }
130  .tree .dir {
131    color: var(--c-dir);
132  }
133  .tree .file-added {
134    color: var(--c-green);
135  }
136  .tree .file-deleted {
137    color: var(--c-red);
138  }
139  .tree .file-renamed {
140    color: var(--c-yellow);
141  }
142  .files {
143    min-width: 0;
144  }
145  .file-section + .file-section {
146    margin-top: 16px;
147  }
148  pre {
149    border: 1px solid var(--c-border);
150    border-top: none;
151    border-bottom-left-radius: var(--border-radius);
152    border-bottom-right-radius: var(--border-radius);
153  }
154  pre {
155    margin: 0;
156    padding: 8px 16px;
157    overflow-x: auto;
158    white-space: pre;
159    word-spacing: normal;
160    word-break: normal;
161    word-wrap: normal;
162    tab-size: 4;
163    font-family: var(--font-family-mono), monospace;
164  }
165  pre > code {
166    display: block;
167    padding: 0 16px;
168    width: fit-content;
169    min-width: 100%;
170    line-height: var(--code-line-height);
171    font-size: var(--code-font-size);
172  }
173  .binary-file {
174    padding: 8px 16px;
175    font-style: italic;
176  }
177  .border {
178    border: 1px solid var(--c-border);
179    border-top: none;
180    border-bottom-left-radius: 6px;
181    border-bottom-right-radius: 6px;
182  }
183</style>
184{{- end}}
185
186{{- define "body" -}}
187<h1>Commit <code>{{.Commit.ShortHash}}</code></h1>
188<div class="commit">
189  <div class="commit-info">
190    <div class="commit-author">{{.Commit.Author}} &lt;{{.Commit.Email}}&gt;</div>
191    <div class="commit-date">{{.Commit.Date | FormatDate}}</div>
192  </div>
193  <div class="commit-message">
194    <div class="commit-subject">
195      {{.Commit.Subject}}
196{{- if .Commit.RefNames}}
197      <span class="ref-badges">
198{{- range .Commit.RefNames}}
199{{- if or (eq .Kind "Branch") (eq .Kind "Tag")}}
200        <span class="badge">{{if eq .Kind "Tag"}}tag: {{end}}{{.Name}}</span>
201{{- end}}
202{{- end}}
203      </span>
204{{- end}}
205    </div>
206{{- if .Commit.Body}}
207    <div class="commit-body">{{.Commit.Body}}</div>
208{{- end}}
209  </div>
210  <div class="commit-subinfo">
211    <div class="commit-branch">
212{{- if .Commit.Branch}}
213      <a href="../commits/{{.Commit.Branch.DirName}}/index.html" class="badge">{{.Commit.Branch}}</a>
214{{- end}}
215    </div>
216{{- if .Commit.Parents}}
217    <div class="commit-parents">
218{{- if eq (len .Commit.Parents) 1}}
219      1 parent
220{{- else}}
221      {{.Commit.Parents | len}} parents
222{{- end}}
223{{- range $i, $p := .Commit.Parents}}
224{{- if gt $i 0}}, {{end}}
225      <a href="{{$p}}.html"><code>{{$p | ShortHash}}</code></a>
226{{- end}}
227    </div>
228{{- end}}
229  </div>
230</div>
231<div class="commit-layout">
232  <div class="files-tree">
233    <div class="files-tree-header">Changed files ({{len .FileViews}})</div>
234    <div class="files-tree-content">
235{{- if .FileTree}}
236      <div class="tree">
237{{- template "file_tree" (FileTreeParams .FileTree)}}
238      </div>
239{{- else}}
240      <div class="empty-message">(no files)</div>
241{{- end}}
242    </div>
243  </div>
244  <div class="files">
245{{- range .FileViews}}
246    <section id="{{.Path}}" class="file-section">
247      <header class="file-header">
248{{- if .IsRename}}
249        <div class="path">{{.OldName}} → {{.NewName}}</div>
250{{- else}}
251        <div class="path">{{.Path}}</div>
252{{- end}}
253      </header>
254{{- if .IsBinary}}
255      <div class="binary-file border">Binary file</div>
256{{- else if (and .IsRename (not .HasChanges))}}
257      <div class="binary-file border">File renamed without changes</div>
258{{- else}}
259      <div class="file-diff">
260{{.HTML}}
261      </div>
262{{- end}}
263    </section>
264{{- end}}
265  </div>
266</div>
267{{- end}}