Design work for mailbox subscriptions
This commit is contained in:
Drew DeVault
parent
18ad982c53
commit
1d0630dde9
|
|
@ -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; }
|
||||
|
|
|
|||
|
|
@ -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" . }}
|
||||
|
|
|
|||
|
|
@ -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 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 new 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 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 new folder</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
{{ end }}
|
||||
|
|
|
|||
Loading…
Reference in New Issue