Hi… I am well aware that this diff view is very suboptimal. It will be fixed when the refactored server comes along!
_header.html: Format the main header
html {
font-family: sans-serif;
background-color: var(--background-color);
color: var(--text-color);
--background-color: hsl(0, 0%, 100%);
--text-color: hsl(0, 0%, 0%);
--link-color: hsl(320, 50%, 36%);
--light-text-color: hsl(0, 0%, 45%);
--darker-border-color: hsl(0, 0%, 72%);
--lighter-border-color: hsl(0, 0%, 85%);
--text-decoration-color: hsl(0, 0%, 72%);
--darker-box-background-color: hsl(0, 0%, 92%);
--lighter-box-background-color: hsl(0, 0%, 95%);
--primary-color: hsl(320, 50%, 36%);
--primary-color-contrast: hsl(320, 0%, 100%);
--danger-color: hsl(0, 50%, 36%);
--danger-color-contrast: hsl(0, 0%, 100%);
}
@media (prefers-color-scheme: dark) {
html {
--background-color: hsl(0, 0%, 0%);
--text-color: hsl(0, 0%, 100%);
--link-color: hsl(320, 50%, 76%);
--light-text-color: hsl(0, 0%, 78%);
--darker-border-color: hsl(0, 0%, 35%);
--lighter-border-color: hsl(0, 0%, 25%);
--text-decoration-color: hsl(0, 0%, 30%);
--darker-box-background-color: hsl(0, 0%, 20%);
--lighter-box-background-color: hsl(0, 0%, 15%);
}
}
body {
margin: 0;
}
html, code, pre {
font-size: 1rem; /* TODO: Not always correct */
}
footer {
margin-top: 1rem;
margin-left: auto;
margin-right: auto;
display: block;
padding: 0 5px;
width: fit-content;
text-align: center;
color: var(--light-text-color);
}
footer a:link, footer a:visited {
color: inherit;
}
.padding-wrapper {
margin: 1rem auto;
max-width: 60rem;
padding: 0 5px;
}
a:link, a:visited {
text-decoration-color: var(--text-decoration-color);
color: var(--link-color);
}
#readme code:not(pre > code) {
background-color: var(--lighter-box-background-color);
border-radius: 2px;
padding: 2px;
}
table {
border: var(--lighter-border-color) solid 1px;
border-spacing: 0px;
border-collapse: collapse;
}
table.wide {
width: 100%;
}
td, th {
padding: 3px 5px;
border: var(--lighter-border-color) solid 1px;
}
th, thead, tfoot {
background-color: var(--lighter-box-background-color);
}
th[scope=row] {
text-align: left;
}
tr.title-row > th {
background-color: var(--darker-box-background-color);
}
td > pre {
margin: 0;
}
td#readme > *:last-child {
margin-bottom: 0;
}
td#readme > *:first-child {
margin-top: 0;
}
.commit-id {
font-family: monospace;
}
.scroll {
overflow-x: auto;
}
.toggle-table-off, .toggle-table-on {
display: none;
}
.toggle-table-off + table > thead > tr > th, .toggle-table-on + table > thead > tr > th {
padding: 0;
}
.toggle-table-off + table > thead > tr > th > label, .toggle-table-on + table > thead > tr > th > label {
width: 100%;
display: inline-block;
padding: 3px 0;
cursor: pointer;
}
.toggle-table-off:checked + table > tbody {
display: none;
}
.toggle-table-on + table > tbody {
display: none;
}
.toggle-table-on:checked + table > tbody {
display: table-row-group;
}
.chunk-unchanged {
color: grey;
}
.chunk-addition {
color: green;
}
@media (prefers-color-scheme: dark) {
.chunk-addition {
color: lime;
}
}
.chunk-deletion {
color: red;
}
.chunk-unknown {
color: yellow;
}
pre.chunk {
margin-top: 0;
margin-bottom: 0;
}
.toggle-on-wrapper {
border: var(--lighter-border-color) solid 1px;
}
.toggle-on-toggle {
display: none;
}
.toggle-on-header {
cursor: pointer;
display: block;
width: 100%;
background-color: var(--lighter-box-background-color);
}
.toggle-on-header > span {
padding: 3px 5px;
display: inline-block;
}
.toggle-on-content {
display: none;
}
.toggle-on-toggle:checked + .toggle-on-header + .toggle-on-content {
display: block;
}
.file-patch + .file-patch {
margin-top: 0.5rem;
}
.file-content {
padding: 3px 5px;
}
.file-header {
font-family: monospace;
}
textarea {
box-sizing: border-box;
background-color: var(--lighter-box-background-color);
resize: vertical;
}
textarea,
input[type=text],
input[type=password] {
font-family: sans-serif;
font-size: smaller;
background-color: var(--lighter-box-background-color);
color: var(--text-color);
border: none;
padding: 0.3rem;
width: 100%;
box-sizing: border-box;
}
td.tdinput, th.tdinput {
padding: 0;
}
td.tdinput textarea,
td.tdinput input[type=text],
td.tdinput input[type=password],
th.tdinput textarea,
th.tdinput input[type=text],
th.tdinput input[type=password] {
background-color: transparent;
}
.btn-primary {
background: var(--primary-color);
color: var(--primary-color-contrast);
border: var(--lighter-border-color) 1px solid;
font-weight: bold;
}
.btn-danger {
background: var(--danger-color);
color: var(--danger-color-contrast);
border: var(--lighter-border-color) 1px solid;
font-weight: bold;
}
.btn-white {
background: var(--primary-color-contrast);
color: var(--primary-color);
border: var(--lighter-border-color) 1px solid;
}
.btn-normal,
input[type=file]::file-selector-button {
background: var(--lighter-box-background-color);
border: var(--lighter-border-color) 1px solid !important;
color: var(--light-text-color);
}
.btn, .btn-white, .btn-danger, .btn-normal, .btn-primary,
input[type=submit],
input[type=file]::file-selector-button {
display: inline-block;
width: auto;
min-width: fit-content;
border-radius: 0;
padding: .1rem .75rem;
font-size: 0.9rem;
transition: background .1s linear;
cursor: pointer;
}
a.btn, a.btn-white, a.btn-danger, a.btn-normal, a.btn-primary {
text-decoration: none;
}
header#main-header {
background-color: var(--lighter-box-background-color);
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
}
header#main-header > div#main-header-forge-title {
flex-grow: 1; /* Allows title to take up remaining space */
}
header#main-header > div#main-header-user {
display: flex;
align-items: center; /* Ensures user section is vertically aligned */
}
{{- define "header" -}}
<div>
<a href="/">Lindenii Forge</a>
</div>
<div>
{{ if ne .user_id "" }}
<a href="/:/users/{{ .user_id }}">{{ .username }}</a>
{{ else }}
<a href="/:/login/">Login</a>
{{ end }}
</div>
<header id="main-header">
<div id="main-header-forge-title">
<a href="/">Lindenii Forge</a>
</div>
<div id="main-header-user">
{{ if ne .user_id "" }}
<a href="/:/users/{{ .user_id }}">{{ .username }}</a>
{{ else }}
<a href="/:/login/">Login</a>
{{ end }}
</div>
</header>
{{- end -}}
{{- define "group_repos" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>Repos in {{ .group_name }} – Lindenii Forge</title>
</head>
<body class="group-repos">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<div class="padding-wrapper">
<h1>
Repos in {{ .group_name }}
</h1>
<ul>
{{- range .repos }}
<li>
<a href="{{ . }}/">{{ . }}</a>
</li>
{{- end }}
</ul>
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "index" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>Index – Lindenii Forge</title>
</head>
<body class="index">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<div class="padding-wrapper">
<h1>Lindenii Forge</h1>
<h2>
Groups
</h2>
<ul>
{{- range .groups }}
<li>
<a href="{{ . }}/:/repos/">{{ . }}</a>
</li>
{{- end }}
</ul>
<h2>
Info
</h2>
<table class="wide">
<tbody>
<tr>
<th scope="row">SSH Public Key</th>
<td><code>{{ .global.server_public_key_string }}</code></td>
</tr>
<tr>
<th scope="row">SSH Fingerprint</th>
<td><code>{{ .global.server_public_key_fingerprint }}</code></td>
</tr>
</tbody>
</table>
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_commit" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>{{ .group_name }}/repos/{{ .repo_name }} – Lindenii Forge</title>
</head>
<body class="repo-commit">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<div class="padding-wrapper scroll">
<table id="commit-info-table">
<thead>
<tr class="title-row">
<th colspan="2">Commit Info</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">ID</th>
<td>{{ .commit_id }}</td>
</tr>
<tr>
<th scope="row">Author</th>
<td>{{ .commit_object.Author.Name }} <<a href="mailto:{{ .commit_object.Author.Email }}">{{ .commit_object.Author.Email }}</a>></td>
</tr>
<tr>
<th scope="row">Author Date</th>
<td>{{ .commit_object.Author.When.Format "Mon, 02 Jan 2006 15:04:05 -0700" }}</td>
</tr>
<tr>
<th scope="row">Committer</th>
<td>{{ .commit_object.Committer.Name }} <<a href="mailto:{{ .commit_object.Committer.Email }}">{{ .commit_object.Committer.Email }}</a>></td>
</tr>
<tr>
<th scope="row">Committer Date</th>
<td>{{ .commit_object.Committer.When.Format "Mon, 02 Jan 2006 15:04:05 -0700" }}</td>
</tr>
<tr>
<th scope="row">Message</th>
<td><pre>{{ .commit_object.Message }}</pre></td>
</tr>
<tr>
<th scope="row">Actions</th>
<td><pre><a href="{{ .commit_object.Hash }}.patch">Get as Patch</a></pre></td>
</tr>
</tbody>
</table>
</div>
<div class="padding-wrapper">
{{ $parent_commit_hash := .parent_commit_hash }}
{{ $commit_object := .commit_object }}
{{ range .file_patches }}
<div class="file-patch toggle-on-wrapper">
<input type="checkbox" id="toggle-{{ .From.Hash }}{{ .To.Hash }}" class="file-toggle toggle-on-toggle">
<label for="toggle-{{ .From.Hash }}{{ .To.Hash }}" class="file-header toggle-on-header">
<span>
{{ if eq .From.Path "" }}
--- /dev/null
{{ else }}
--- a/<a href="../tree/{{ .From.Path }}?commit={{ $parent_commit_hash }}">{{ .From.Path }}</a> {{ .From.Mode }}
{{ end }}
<br />
{{ if eq .To.Path "" }}
+++ /dev/null
{{ else }}
+++ b/<a href="../tree/{{ .To.Path }}?commit={{ $commit_object.Hash }}">{{ .To.Path }}</a> {{ .To.Mode }}
{{ end }}
</span>
</label>
<div class="file-content toggle-on-content scroll">
{{ range .Chunks }}
{{ if eq .Type 0 }}
<pre class="chunk chunk-unchanged">{{ .Content }}</pre>
{{ else if eq .Type 1 }}
<pre class="chunk chunk-addition">{{ .Content }}</pre>
{{ else if eq .Type 2 }}
<pre class="chunk chunk-deletion">{{ .Content }}</pre>
{{ else }}
<pre class="chunk chunk-unknown">{{ .Content }}</pre>
{{ end }}
{{ end }}
</div>
</div>
{{ end }}
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_index" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>{{ .group_name }}/repos/{{ .repo_name }} – Lindenii Forge</title>
</head>
<body class="repo-index">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<div class="padding-wrapper">
<table id="repo-info-table">
<thead>
<tr class="title-row">
<th colspan="2">Repo Info</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">Clone</th>
<td><code>git clone {{ .clone_url }}</code></td>
</tr>
</tbody>
</table>
</div>
<div class="padding-wrapper scroll">
<input id="toggle-table-recent-commits" type="checkbox" class="toggle-table-off" />
<table id="recent-commits" class="wide">
<thead>
<tr class="title-row">
<th colspan="3"><label for="toggle-table-recent-commits">Recent Commits (<a href="log/{{ .ref }}/">see all</a>)</label></th>
</tr>
</thead>
<tbody>
{{- range .commits }}
<tr>
<td class="commit-title"><a href="commit/{{ .ID }}">{{ .Message | first_line }}</a></td>
<td class="commit-author">
<a class="email-name" href="mailto:{{ .Author.Email }}">{{ .Author.Name }}</a>
</td>
<td class="commit-time">
{{ .Author.When.Format "2006-01-02 15:04:05 -0700" }}
</td>
</tr>
{{- end }}
</tbody>
</table>
</div>
<div class="padding-wrapper scroll">
<input id="toggle-table-file-tree" type="checkbox" class="toggle-table-off" />
<table id="file-tree" class="wide">
<thead>
<tr class="title-row">
<th colspan="3"><label for="toggle-table-file-tree">/ on {{ .ref }}</label></th>
</tr>
</thead>
<tbody>
{{- $ref := .ref }}
{{- range .files }}
<tr>
<td class="file-mode">{{ .Mode }}</td>
<td class="file-name"><a href="tree/{{ .Name }}">{{ .Name }}</a>{{ if not .Is_file }}/{{ end }}</td>
<td class="file-size">{{ .Size }}</td>
</tr>
{{- end }}
</tbody>
</table>
</div>
<div class="padding-wrapper">
<div id="refs">
</div>
</div>
<div class="padding-wrapper">
{{ if .readme }}
<input id="toggle-table-readme" type="checkbox" class="toggle-table-off" />
<table class="wide">
<thead>
<tr class="title-row">
<th><label for="toggle-table-readme">{{ .readme_filename }}</label></th>
</tr>
</thead>
<tbody>
<tr>
<td id="readme">
{{ .readme -}}
</td>
</tr>
</tbody>
</table>
{{ end }}
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_log" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>Log of {{ .group_name }}/repos/{{ .repo_name }} – Lindenii Forge</title>
</head>
<body class="repo-log">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<table id="commits" class="wide">
<thead>
<tr class="title-row">
<th colspan="4">Commits on {{ .ref }}</th>
</tr>
<tr>
<th scope="col">ID</th>
<th scope="col">Title</th>
<th scope="col">Author</th>
<th scope="col">Time</th>
</tr>
</thead>
<tbody>
{{- range .commits }}
<tr>
<td class="commit-id"><a href="../commit/{{ .ID }}">{{ .ID }}</a></td>
<td class="commit-title">{{ .Message | first_line }}</td>
<td class="commit-author">
<a class="email-name" href="mailto:{{ .Author.Email }}">{{ .Author.Name }}</a>
</td>
<td class="commit-time">
{{ .Author.When.Format "2006-01-02 15:04:05 -0700" }}
</td>
</tr>
{{- end }}
</tbody>
</table>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_raw_dir" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>{{ .group_name }}/repos/{{ .repo_name }}/{{ .path_spec }}{{ if ne .path_spec "" }}/{{ end }} – Lindenii Forge</title>
</head>
<body class="repo-raw-dir">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<div class="padding-wrapper scroll">
<table id="file-tree" class="wide">
<thead>
<tr class="title-row">
<th colspan="3">
(Raw) /{{ .path_spec }}{{ if ne .path_spec "" }}/{{ end }} on {{ .ref }}
</th>
</tr>
</thead>
<tbody>
{{- $path_spec := .path_spec }}
{{- range .files }}
<tr>
<td class="file-mode">{{ .Mode }}</td>
<td class="file-name"><a href="{{ .Name }}{{ if not .Is_file }}/{{ end }}">{{ .Name }}</a>{{ if not .Is_file }}/{{ end }}</td>
<td class="file-size">{{ .Size }}</td>
</tr>
{{- end }}
</tbody>
</table>
</div>
<div class="padding-wrapper">
<div id="refs">
</div>
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_tree_dir" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<title>{{ .group_name }}/repos/{{ .repo_name }}/{{ .path_spec }}{{ if ne .path_spec "" }}/{{ end }} – Lindenii Forge</title>
</head>
<body class="repo-tree-dir">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<div class="padding-wrapper scroll">
<table id="file-tree" class="wide">
<thead>
<tr class="title-row">
<th colspan="3">
/{{ .path_spec }}{{ if ne .path_spec "" }}/{{ end }} on {{ .ref }}
</th>
</tr>
</thead>
<tbody>
{{- $path_spec := .path_spec }}
{{- range .files }}
<tr>
<td class="file-mode">{{ .Mode }}</td>
<td class="file-name"><a href="{{ .Name }}{{ if not .Is_file }}/{{ end }}">{{ .Name }}</a>{{ if not .Is_file }}/{{ end }}</td>
<td class="file-size">{{ .Size }}</td>
</tr>
{{- end }}
</tbody>
</table>
</div>
<div class="padding-wrapper">
<div id="refs">
</div>
</div>
<div class="padding-wrapper">
{{ if .readme }}
<table class="wide">
<thead>
<tr class="title-row">
<th>{{ .readme_filename }}</th>
</tr>
</thead>
<tbody>
<tr>
<td id="readme">
{{ .readme -}}
</td>
</tr>
</tbody>
</table>
{{ end }}
</div>
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}
{{- define "repo_tree_file" -}}
<!DOCTYPE html>
<html lang="en">
<head>
{{ template "head_common" . }}
<link rel="stylesheet" href="/:/static/chroma.css" />
<title>{{ .group_name }}/repos/{{ .repo_name }}/{{ .path_spec }} – Lindenii Forge</title>
</head>
<body class="repo-tree-file">
<header>
{{ template "header" . }}
</header>
{{ template "header" . }}
<header>
{{ template "repo_header" . }}
</header>
<p>
/{{ .path_spec }} (<a href="/{{ .group_name }}/:/repos/{{ .repo_name }}/raw/{{ .path_spec }}{{ if not (eq .ref_type "head") }}?{{ .ref_type }}={{ .ref }}{{ end }}">raw</a>)
</p>
{{ .file_contents }}
<footer>
{{ template "footer" . }}
</footer>
</body>
</html>
{{- end -}}