nonshy/website
nonshy/website
1
0
Fork 0
Code Issues 21 Pull Requests 1 Packages Projects Releases Wiki Activity

Stylize the Messages view

Browse Source
This commit is contained in:
Noah Petherbridge 2023-12-25 22:13:03 -08:00
parent cadb759ff4
commit d808741752
2 changed files with 51 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/static/css/theme.css
View File

@ -8,6 +8,10 @@ abbr {
cursor: not-allowed;
}
.cursor-pointer {
cursor: pointer;
}
img {
/* https://stackoverflow.com/questions/12906789/preventing-an-image-from-being-draggable-or-selectable-without-using-js */
user-drag: none;

76
web/templates/inbox/inbox.html
View File

@ -10,7 +10,7 @@
</h1>
<h2 class="subtitle">
{{if eq .Box "threads"}}
Threads
Conversation Threads
{{else if eq .Box "sent"}}
Sent
{{else}}
@ -234,34 +234,52 @@
</div>
{{end}}
<ul class="menu-list block">
{{range .Messages}}
<li>
<a href="/messages/read/{{.ID}}">
<div>
{{if eq $Root.Box "sent"}}
{{$User := $UserMap.Get .TargetUserID}}
<strong>Sent to {{$User.Username}}</strong>
{{else}}
{{$User := $UserMap.Get .SourceUserID}}
<strong>From {{$User.Username}}</strong>
{{end}}
{{if not .Read}}
<span class="tag is-success">{{if eq $Root.Box "sent"}}UNREAD{{else}}NEW{{end}}</span>
{{end}}
</div>
<div class="my-1">
<em>
{{Substring .Message 48}}…
</em>
</div>
<div>
Sent {{.CreatedAt.Format "2006-01-02 15:04:05"}}
</div>
</a>
</li>
{{end}}
</ul>
<table class="table is-striped is-fullwidth is-hoverable">
<tbody>
{{range .Messages}}
<tr>
<td class="cursor-pointer" onclick="window.location='/messages/read/{{.ID}}'">
<div class="columns is-mobile is-gapless mb-0">
{{if eq $Root.Box "sent"}}
{{$User := $UserMap.Get .TargetUserID}}
<div class="column is-narrow">
<strong class="has-text-success-dark">Sent To</strong>
</div>
<div class="column is-narrow mx-2">
{{template "avatar-24x24" $User}}
</div>
<div class="column has-text-success-dark">{{$User.Username}}</div>
{{else}}
{{$User := $UserMap.Get .SourceUserID}}
<div class="column is-narrow">
<strong class="has-text-info-dark">From</strong>
</div>
<div class="column is-narrow mx-2">
{{template "avatar-24x24" $User}}
</div>
<div class="column has-text-info-dark">{{$User.Username}}</div>
{{end}}
</div>
<div class="my-1">
<a href="/messages/read/{{.ID}}" class="has-text-dark">
<em>
{{Substring .Message 48}}{{if gt (len .Message) 48}}…{{end}}
</em>
</a>
</div>
<div>
<a href="/messages/read/{{.ID}}" class="has-text-dark">
Sent {{.CreatedAt.Format "2006-01-02 15:04:05"}}
{{if not .Read}}
<span class="tag is-success">{{if eq $Root.Box "sent"}}UNREAD{{else}}NEW{{end}}</span>
{{end}}
</a>
</div>
</td>
</tr>
{{end}}
</tbody>
</table>
<!-- Pager footer -->
<div class="block">