Design work for mailbox subscriptions

This commit is contained in:
Drew DeVault 2020-11-13 13:23:29 -05:00
parent 18ad982c53
commit 1d0630dde9
3 changed files with 117 additions and 44 deletions

View file

@ -127,10 +127,60 @@ footer { text-align: right; }
aside { flex: 0 0 180px; }
aside a,
aside .noselect { width: 100%; display: block; padding: 0.4rem 0 0.4rem 0.5rem; }
aside a.active { font-weight: bold; color: black; text-decoration: none; }
aside img { display: block; }
aside ul {
list-style: none;
margin: 0;
padding: 0;
}
aside li {
width: 100%;
display: flex;
padding: 0.4rem 0 0.4rem 0.5rem;
}
aside li a {
flex-grow: 1;
}
aside .active {
font-weight: bold;
color: black;
text-decoration: none;
}
aside .active,
aside .new.active {
background-color: #f6f6f6;
}
aside .new.active {
color: #008d47;
}
aside button {
margin: 0;
cursor: pointer;
text-decoration: none;
text-align: center;
display: inline-block;
padding: 0 0.3rem;
margin-right: 0.3rem;
border: none;
background: transparent;
}
aside .active button:hover {
background: white;
}
aside button:hover {
background: #f6f6f6;
}
main {
flex: 1 100%;
display: flex;
@ -151,15 +201,6 @@ main.login > section {
padding: 1rem;
}
aside a.active,
aside a.new.active {
background-color: #f6f6f6;
}
aside a.new.active {
color: #008d47;
}
aside a.new.active,
main.create-update {
background-color: #f6fff6;
@ -455,6 +496,11 @@ main.create-update .event-date input {
border: none;
color: #BFA300;
font-size: 13pt;
background: transparent;
}
.message-list-unread.message-list-flags .flag-button:hover {
background: #f8f8f8;
}
.message-list-subject a { color: #77c; }

View file

@ -5,7 +5,7 @@
<div class="page-wrap">
{{ template "aside" . }}
<div class="container">
<form id="messages-form" method="post"></form>
<form id="messages-form" method="POST"></form>
<main class="message-list">
<section class="actions">
{{ template "messages-header.html" . }}

View file

@ -1,42 +1,69 @@
{{ define "mbox-link" }}
{{ if not (.HasAttr "\\Noselect") }}
<a href="{{.URL}}" {{ if .Active }}class="active"{{ end }}>
{{- if eq .Name "INBOX" -}}
Inbox
{{- else -}}
{{ .Name }}
{{- end -}}
{{- if .HasAttr "\\HasChildren" }}/{{ end }}
</a>
<li {{ if .Active }}class="active"{{ end }}>
<a href="{{.URL}}">
{{- if eq .Name "INBOX" -}}
Inbox
{{- else -}}
{{ .Name }}
{{- end -}}
{{- if .HasAttr "\\HasChildren" }}/{{ end }}
</a>
<!-- TODO: Rig up this form -->
<button
type="submit"
name="subscribe"
value="{{.Name}}"
form="subscribe-form"
{{ if eq .Name "INBOX" }}
title="Unsubscribe"
{{ else }}
title="Subscribe"
{{ end }}
>
{{ if eq .Name "INBOX" }}
{{ else }}
{{ end }}
</button>
</li>
{{ else }}
<span class="noselect">
<li class="noselect">
{{.Name}}{{- if .HasAttr "\\HasChildren" }}/{{ end }}
</span>
</li>
{{ end }}
{{ end }}
{{ define "aside" }}
<form id="subscribe-form" method="POST"></form>
<aside>
<!-- the logo image, dimensions 200x32 may be present or not -->
<a href="/compose" class="new
{{ if eq $.GlobalData.URL.Path "/compose" }}active{{ end }}
">Compose&nbsp;mail</a>
{{ with .CategorizedMailboxes }}
{{ with .Common.Inbox }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Drafts }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Sent }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Junk }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Trash }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Archive }}{{ template "mbox-link" . }}{{ end }}
{{ if .Additional }}
<hr />
{{ range .Additional }}
{{ template "mbox-link" . }}
{{ end }}
{{ end }}
{{ end }}
<a href="/new-mailbox" class="new
{{ if eq $.GlobalData.URL.Path "/new-mailbox" }}active{{ end }}
">Create&nbsp;new&nbsp;folder</a>
<ul>
<!-- the logo image, dimensions 200x32 may be present or not -->
<li>
<a href="/compose" class="new
{{ if eq $.GlobalData.URL.Path "/compose" }}active{{ end }}
">Compose&nbsp;mail</a>
</li>
{{ with .CategorizedMailboxes }}
{{ with .Common.Inbox }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Drafts }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Sent }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Junk }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Trash }}{{ template "mbox-link" . }}{{ end }}
{{ with .Common.Archive }}{{ template "mbox-link" . }}{{ end }}
{{ if .Additional }}
<hr />
{{ range .Additional }}
{{ template "mbox-link" . }}
{{ end }}
{{ end }}
{{ end }}
<li>
<a href="/new-mailbox" class="new
{{ if eq $.GlobalData.URL.Path "/new-mailbox" }}active{{ end }}
">Create&nbsp;new&nbsp;folder</a>
</li>
</ul>
</aside>
{{ end }}