Improve diff display
This commit is contained in:
parent
bb3bc66434
commit
b3b20d8a77
3 changed files with 44 additions and 26 deletions
|
@ -99,6 +99,14 @@ del {
|
||||||
text-decoration-color: hsl(0 50% 40% / 50%);
|
text-decoration-color: hsl(0 50% 40% / 50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.diff-before ins {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diff-after del {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
code {
|
code {
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
}
|
}
|
||||||
|
@ -128,6 +136,8 @@ details[open] summary::before {
|
||||||
transform: rotate(90deg);
|
transform: rotate(90deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Layout */
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
padding-top: 1rem;
|
padding-top: 1rem;
|
||||||
padding-bottom: 1rem;
|
padding-bottom: 1rem;
|
||||||
|
@ -218,12 +228,20 @@ details[open] summary::before {
|
||||||
margin: 0 0.25rem;
|
margin: 0 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Utils & components */
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
max-width: 1200px;
|
max-width: 1200px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 0 1rem;
|
padding: 0 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.inline-icon {
|
||||||
|
display: inline-block;
|
||||||
|
fill: currentColor;
|
||||||
|
width: 1.25em;
|
||||||
|
}
|
||||||
|
|
||||||
.input {
|
.input {
|
||||||
border-radius: var(--radius-s);
|
border-radius: var(--radius-s);
|
||||||
border: 1px solid var(--border-color);
|
border: 1px solid var(--border-color);
|
||||||
|
@ -389,16 +407,6 @@ details[open] summary::before {
|
||||||
font-size: var(--font-size-l);
|
font-size: var(--font-size-l);
|
||||||
}
|
}
|
||||||
|
|
||||||
.inline-icon {
|
|
||||||
display: inline-block;
|
|
||||||
fill: currentColor;
|
|
||||||
width: 1.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.changeset details[open] summary {
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.changeset table th {
|
.changeset table th {
|
||||||
font-size: var(--font-size-s);
|
font-size: var(--font-size-s);
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
|
|
@ -16,6 +16,10 @@
|
||||||
padding: 0.5rem 0.75rem;
|
padding: 0.5rem 0.75rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.diff-table td:last-child {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.diff-table th {
|
.diff-table th {
|
||||||
font-size: var(--font-size-xs);
|
font-size: var(--font-size-xs);
|
||||||
color: var(--color-muted);
|
color: var(--color-muted);
|
||||||
|
@ -38,7 +42,18 @@
|
||||||
{% for diff in diffs %}
|
{% for diff in diffs %}
|
||||||
<tr>
|
<tr>
|
||||||
<th>{{ diff.diff_time }}</th>
|
<th>{{ diff.diff_time }}</th>
|
||||||
<td>{{ diff.diff_html|safe }}</td>
|
<td>
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<th>Before</th>
|
||||||
|
<td class="diff-before">{{ diff.diff_html|safe }}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<th>After</th>
|
||||||
|
<td class="diff-after">{{ diff.diff_html|safe }}</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</table>
|
</table>
|
||||||
|
|
|
@ -40,21 +40,16 @@
|
||||||
Show change history
|
Show change history
|
||||||
</a>
|
</a>
|
||||||
</p>
|
</p>
|
||||||
<details>
|
|
||||||
<summary class="changeset-title">
|
|
||||||
<h2 class="diff">{{ diff.diff_html|safe }}</h2>
|
|
||||||
</summary>
|
|
||||||
<table>
|
<table>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Old</th>
|
<th>Before</th>
|
||||||
<td>{{ diff.title_orig }}</td>
|
<td class="diff-before changeset-title">{{ diff.diff_html|safe }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>New</th>
|
<th>After</th>
|
||||||
<td>{{ diff.title_new }}</td>
|
<td class="diff-after changeset-title">{{ diff.diff_html|safe }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</details>
|
|
||||||
</article>
|
</article>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in a new issue