140 lines
No EOL
2.9 KiB
HTML
140 lines
No EOL
2.9 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Stack history for {{stack_name}}{% endblock %}
|
|
|
|
{% block content %}
|
|
<main>
|
|
<header>
|
|
<h1>Stack history for <span class="stack-name">{{stack_name}}</span></h1>
|
|
<div id="page-actions">
|
|
</div>
|
|
</header>
|
|
<section class="versions">
|
|
{% for (i, commit) in commits.iter().enumerate() %}
|
|
<article>
|
|
<p>
|
|
<time datetime="{{commit.date}}">{{commit.date_human()}}</time>
|
|
<span class="commit_id">
|
|
{{commit.oid[..7]}}
|
|
</span>
|
|
</p>
|
|
<details open>
|
|
<summary title="{{commit.message}} ({{commit.author}})">
|
|
{{commit.message}}
|
|
</summary>
|
|
<code>
|
|
{% for line in commit.diff() %}
|
|
{% match line.chars().next() %}
|
|
{% when Some with ('+') %}
|
|
<pre class="add">{{line}}</pre>
|
|
{% when Some with ('-') %}
|
|
<pre class="del">{{line}}</pre>
|
|
{% when _ %}
|
|
<pre class="context">{{line}}</pre>
|
|
{% endmatch %}
|
|
{% endfor %}
|
|
</code>
|
|
</details>
|
|
<div class="actions">
|
|
{% if i == 0 %}
|
|
<button disabled>CURRENT</button>
|
|
{% else %}
|
|
<form method="POST" action="./history/revert">
|
|
<input type="hidden" name="oid" value="{{commit.oid}}" />
|
|
<button type="submit">Revert to this revision</button>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
</article>
|
|
{% endfor %}
|
|
</section>
|
|
</main>
|
|
|
|
<style scoped>
|
|
.stack-name {
|
|
color: var(--text-accent);
|
|
}
|
|
|
|
summary {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.versions {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1ch;
|
|
|
|
& article {
|
|
border: 1px solid var(--table-border-color);
|
|
background-color: var(--table-bg);
|
|
border-radius: 3px;
|
|
padding: 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.5ch;
|
|
|
|
& p {
|
|
font-size: 9pt;
|
|
margin: 0;
|
|
|
|
& .commit_id::before {
|
|
content: " - ";
|
|
}
|
|
}
|
|
|
|
& code {
|
|
font-size: 10pt;
|
|
background-color: var(--bg-raised);
|
|
display: flex;
|
|
flex-direction: column;
|
|
border-radius: 5px;
|
|
padding: 4px 6px;
|
|
margin-top: 0.5ch;
|
|
}
|
|
|
|
& pre {
|
|
&.context {
|
|
color: var(--button-color);
|
|
}
|
|
|
|
&.add {
|
|
color: var(--success-text);
|
|
}
|
|
|
|
&.del {
|
|
color: var(--danger-text);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.actions {
|
|
& button {
|
|
padding: 2px 6px;
|
|
font-size: 10pt;
|
|
}
|
|
}
|
|
|
|
header {
|
|
margin-bottom: 1rem;
|
|
}
|
|
</style>
|
|
|
|
<script type="module">
|
|
const actions = document.getElementById("page-actions");
|
|
const toggle_text = ["Collapse all", "Expand all"];
|
|
|
|
/** @type {HTMLDetailsElement[]} */
|
|
const versions = [...document.querySelectorAll(".versions details")];
|
|
|
|
let toggle = document.createElement("button");
|
|
toggle.type = "button";
|
|
toggle.appendChild(document.createTextNode(toggle_text[0]));
|
|
toggle.addEventListener("click", () => {
|
|
const index = toggle_text.indexOf(toggle.textContent);
|
|
versions.forEach(version => { version.open = index == 1 });
|
|
toggle.textContent = toggle_text[(index + 1) % 2];
|
|
});
|
|
actions.appendChild(toggle);
|
|
</script>
|
|
{% endblock %} |