web: make post.html layout more compact
parent
828bbfe071
commit
28156fdb75
|
@ -664,11 +664,11 @@
|
|||
}
|
||||
|
||||
table.headers {
|
||||
margin-left: -3vw;
|
||||
padding: .5rem 0 .5rem 1rem;
|
||||
}
|
||||
|
||||
table.headers tr>th {
|
||||
text-align: right;
|
||||
text-align: left;
|
||||
color: var(--text-faded);
|
||||
}
|
||||
|
||||
|
@ -686,24 +686,25 @@
|
|||
width: 50ch;
|
||||
}
|
||||
|
||||
div.post-body {
|
||||
margin: 1rem 0px;
|
||||
}
|
||||
|
||||
div.post-body>pre {
|
||||
border-top: 1px solid;
|
||||
overflow-wrap: break-word;
|
||||
white-space: pre-line;
|
||||
hyphens: auto;
|
||||
background-color: var(--background-secondary);
|
||||
outline: 1rem solid var(--background-secondary);
|
||||
margin: 2rem 0;
|
||||
line-height: 1.333;
|
||||
line-height: 1.1;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
div.post-body:not(:last-child) {
|
||||
padding-bottom: .5rem;
|
||||
div.post {
|
||||
border-top: 1px solid var(--horizontal-rule);
|
||||
border-right: 1px solid var(--horizontal-rule);
|
||||
border-left: 1px solid var(--horizontal-rule);
|
||||
border-bottom: 1px solid var(--horizontal-rule);
|
||||
}
|
||||
div.post:not(:first-child) {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
td.message-id,
|
||||
span.message-id{
|
||||
|
@ -738,12 +739,11 @@
|
|||
span.faded:is(:focus, :hover, :focus-visible, :focus-within) {
|
||||
color: revert;
|
||||
}
|
||||
details.reply-details button {
|
||||
padding: 0.3rem;
|
||||
font-size: medium;
|
||||
min-width: 0;
|
||||
margin-block-start: 0.2rem;
|
||||
display: inline-block;
|
||||
tr>td>details.reply-details ~ tr {
|
||||
display: none;
|
||||
}
|
||||
tr>td>details.reply-details[open] ~ tr {
|
||||
display: revert;
|
||||
}
|
||||
|
||||
ul.lists {
|
||||
|
|
|
@ -1,46 +1,28 @@
|
|||
<table class="headers" title="E-mail headers">
|
||||
<caption class="screen-reader-only">E-mail headers</caption>
|
||||
{% if is_root %}
|
||||
<div class="post">
|
||||
<table class="headers" title="E-mail headers">
|
||||
<caption class="screen-reader-only">E-mail headers</caption>
|
||||
<tr>
|
||||
<th scope="row">List:</th>
|
||||
<td class="faded">{{ list.id }}</td>
|
||||
<th scope="row">From:</th>
|
||||
<td>{{ post.address }}</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
<tr>
|
||||
<th scope="row">From:</th>
|
||||
<td>{{ post.address }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
{% if is_root %}
|
||||
<tr>
|
||||
<th scope="row">To:</th>
|
||||
<td class="faded">{{ post.to }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Subject:</th>
|
||||
<td>{{ trimmed_subject }}</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
<th scope="row">Date:</th>
|
||||
<td class="faded">{{ post.datetime }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
{% if is_root %}
|
||||
{% if in_reply_to %}
|
||||
<tr>
|
||||
<th scope="row">In-Reply-To:</th>
|
||||
<td class="faded message-id"><a href="{{ list_post_path(list.id, in_reply_to) }}">{{ in_reply_to }}</a></td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% if references %}
|
||||
<tr>
|
||||
<th scope="row">References:</th>
|
||||
<td>{% for r in references %}<span class="faded message-id"><a href="{{ list_post_path(list.id, r) }}">{{ r }}</a></span>{% endfor %}</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<tr>
|
||||
<th scope="row">Date:</th>
|
||||
<td class="faded">{{ post.datetime }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Message-ID:</th>
|
||||
<td class="faded message-id"><a href="{{ list_post_path(list.id, post.message_id) }}">{{ strip_carets(post.message_id) }}</a></td>
|
||||
</tr>
|
||||
{% if in_reply_to %}
|
||||
<tr>
|
||||
<th scope="row">In-Reply-To:</th>
|
||||
<td class="faded message-id"><a href="{{ list_post_path(list.id, in_reply_to) }}">{{ in_reply_to }}</a></td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% if references %}
|
||||
<tr>
|
||||
<th scope="row">References:</th>
|
||||
<td>{% for r in references %}<span class="faded message-id"><a href="{{ list_post_path(list.id, r) }}">{{ r }}</a></span>{% endfor %}</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
<tr>
|
||||
|
@ -48,6 +30,6 @@
|
|||
</tr>
|
||||
</table>
|
||||
<div class="post-body">
|
||||
<pre {% if odd %}style="--background-secondary: var(--background-critical);" {% endif %}title="E-mail text content">{{ body }}</pre>
|
||||
<pre {% if odd %}style="--background-secondary: var(--background-critical);" {% endif %}title="E-mail text content">{{ body|trim }}</pre>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue