alps/themes/alps/message.html
Drew DeVault e39879ec9a
alps theme: overhaul tables and action lists
This patch contains a whole lot of layout improvements for the alps
theme, mainly replacing the table soup with flexbox and CSS grids, and
fixing up a number of loose ends. This gives us a lot more flexibility
over how the page is laid out. I also cleaned up a lot of other
low-hanging fruit in the layout & styles.
2020-05-13 19:55:41 +02:00

165 lines
6.2 KiB
HTML

{{template "head.html" .}}
{{template "nav.html" .}}
<div class="page-wrap">
{{$current := .Mailbox}}
<aside>
<!-- the logo image, dimensions 200x32 may be present or not -->
<a href="/compose" class="compose-mail">Compose&nbsp;Mail</a>
{{$current := .Mailbox}}
{{range .Mailboxes}}
<a href="{{.URL}}"
{{ if eq $current.Name .Name }}class="active"{{ end }}>
{{ if eq .Name "INBOX" }}
Inbox
{{else}}
{{.Name}}
{{end}}
{{ if eq $current.Name .Name }}
{{ if $current.Unseen }}({{ $current.Unseen }}){{ end }}
{{ end }}
</a>
{{end}}
</aside>
<div class="container">
<main class="message">
<section class="actions">
<div class="actions-wrap">
<div class="actions-message">
{{$back := printf "%v?page=%v" .Mailbox.URL .MailboxPage}}
<a href="{{$back}}" class="button-link">« Back</a>
{{ if and (ne .Mailbox.Name "Archive") (ne .Mailbox.Name "Drafts") (ne .Mailbox.Name "Sent") }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/move">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="to" value="Archive">
<input type="hidden" name="next" value="{{$back}}">
<button>Archive</button>
</form>
{{ end }}
{{ if and (ne .Mailbox.Name "INBOX") (ne .Mailbox.Name "Sent") (ne .Mailbox.Name "Drafts") }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/move">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="to" value="INBOX">
<button>
{{ if (eq .Mailbox.Name "Junk") }}
Not Spam
{{ else }}
Move to Inbox
{{ end }}
</button>
</form>
{{ end }}
{{ if or (eq .Mailbox.Name "INBOX") (eq .Mailbox.Name "Trash") }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/move">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="next" value="{{$back}}">
<input type="hidden" name="to" value="Junk">
<button>Report Spam</button>
</form>
{{ end }}
{{ if or (eq .Mailbox.Name "Trash") (eq .Mailbox.Name "Junk") }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/delete">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="next" value="{{$back}}">
<button>Delete Permanently</button>
</form>
{{ else }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/move">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="next" value="{{$back}}">
<input type="hidden" name="to" value="Trash">
<button>Delete</button>
</form>
{{ end }}
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/flag">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<input type="hidden" name="action" value="remove">
<input type="hidden" name="flags" value="\Seen">
<input type="hidden" name="next" value="{{$back}}">
<button>Mark&nbsp;Unread</button>
</form>
<form class="action-group" method="post" action="/message/{{.Mailbox.Name | pathescape}}/move">
<input type="hidden" name="uids" value="{{.Message.Uid}}">
<select class="action-group" name="to">
{{range .Mailboxes}}
<option value="{{.Name}}" {{if eq .Name $.Mailbox.Name}}selected>Move to...{{else}}>{{.Name}}{{ end }}</option>
{{end}}
</select>
<button class="action-group" type="submit">Move</button>
</form>
<span class="followups">
{{if .Message.HasFlag "\\Draft"}}
<a class="action-group button-link" href="{{.Message.URL}}/edit?part={{.Part.PathString}}">Edit draft</a>
{{else}}
<a class="action-group button-link" href="{{.Message.URL}}/reply?part={{.Part.PathString}}">Reply</a>
<a class="action-group button-link" href="{{.Message.URL}}/forward?part={{.Part.PathString}}">Forward</a>
{{end}}
</span>
</div>
</div>
</section>
<table>
<tr>
<th colspan="2">
<h1>
{{if .Message.Envelope.Subject}}
{{.Message.Envelope.Subject}}
{{else}}
(No subject)
{{end}}
</h1>
</th>
</tr>
<tr>
<th>From:</th>
<td>{{template "addr-list" .Message.Envelope.From}}</td>
</tr>
<tr>
<th>Date:</th>
<td>{{.Message.Envelope.Date | formatdate}}</td>
</tr>
<tr>
<th>To:</th><td>{{template "addr-list" .Message.Envelope.To}}</td>
</tr>
{{if .Message.Envelope.Cc}}
<tr>
<th>Cc:</th><td>{{template "addr-list" .Message.Envelope.Cc}}</td>
</tr>
{{end}}
{{if .Message.Envelope.Bcc}}
<tr>
<th>Bcc:</th>
<td>{{template "addr-list" .Message.Envelope.Bcc}}</td>
</tr>
{{ end }}
</table>
{{define "addr-list"}}
{{range $i, $addr := .}}
{{if $i}},{{end}}
<strong>{{.PersonalName}}</strong>
&lt;<a href="/compose?to={{.Address}}">{{.Address}}</a>&gt;
{{end}}
{{end}}
{{if .View}}
{{.View}}
{{else}}
<p>Can't preview this message part.</p>
<a href="{{.Message.Uid}}/raw?part={{.Part.PathString}}">Download</a>
{{end}}
</main>
</div>
</div>
{{template "foot.html"}}