Update notification layout

This commit is contained in:
r 2020-01-29 18:14:27 +00:00
parent 2c084dfd09
commit f93fe32766
5 changed files with 31 additions and 44 deletions

View File

@ -50,7 +50,6 @@ type Status struct {
// Custom fields // Custom fields
Pleroma StatusPleroma `json:"pleroma"` Pleroma StatusPleroma `json:"pleroma"`
HideAccountInfo bool `json:"hide_account_info"`
ShowReplies bool `json:"show_replies"` ShowReplies bool `json:"show_replies"`
ReplyMap map[string][]ReplyInfo `json:"reply_map"` ReplyMap map[string][]ReplyInfo `json:"reply_map"`
ReplyNumber int `json:"reply_number"` ReplyNumber int `json:"reply_number"`

View File

@ -490,13 +490,6 @@ func (svc *service) ServeNotificationPage(ctx context.Context, c *model.Client,
} }
for i := range notifications { for i := range notifications {
if notifications[i].Status != nil {
notifications[i].Status.CreatedAt = notifications[i].CreatedAt
switch notifications[i].Type {
case "reblog", "favourite":
notifications[i].Status.HideAccountInfo = true
}
}
if notifications[i].Pleroma != nil && !notifications[i].Pleroma.IsSeen { if notifications[i].Pleroma != nil && !notifications[i].Pleroma.IsSeen {
unreadCount++ unreadCount++
} }

View File

@ -138,7 +138,7 @@
} }
.retweet-info { .retweet-info {
margin: 8px 0 4px 24px; margin: 0 0 2px 24px;
} }
.retweet-info .status-profile-img { .retweet-info .status-profile-img {
@ -176,9 +176,7 @@
border-color: #777777; border-color: #777777;
} }
.notification-follow-container, .notification-follow-container {
.notification-like-container,
.notification-retweet-container {
display: flex; display: flex;
} }
@ -190,6 +188,10 @@
margin-top: 8px; margin-top: 8px;
} }
.notification-time {
margin-left: 8px;
}
.status-reply-to { .status-reply-to {
display: inline-block; display: inline-block;
vertical-align: center; vertical-align: center;

View File

@ -17,6 +17,9 @@
<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span> <span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>
<img class="icon" src="{{GetIcon "user-plus" $.Ctx.DarkMode}}" alt="followed" /> <img class="icon" src="{{GetIcon "user-plus" $.Ctx.DarkMode}}" alt="followed" />
<span> followed you </span> <span> followed you </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div> </div>
<div class="notification-follow-uname"> <div class="notification-follow-uname">
@{{.Account.Acct}} @{{.Account.Acct}}
@ -28,38 +31,32 @@
{{template "status" (WithContext .Status $.Ctx)}} {{template "status" (WithContext .Status $.Ctx)}}
{{else if eq .Type "reblog"}} {{else if eq .Type "reblog"}}
<div class="notification-retweet-container"> <div class="retweet-info">
<div class="status-profile-img-container">
<a class="img-link" href="/user/{{.Account.ID}}"> <a class="img-link" href="/user/{{.Account.ID}}">
<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="profile-avatar" /> <img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
</a> </a>
</div>
<div>
<div class="notification-info-text">
<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span> <span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>
<img class="icon" src="{{GetIcon "retweeted" $.Ctx.DarkMode}}" alt="retweeted" /> <img class="icon" src="{{GetIcon "retweeted" $.Ctx.DarkMode}}" alt="retweeted" />
<span> retweeted your post </span> <span> retweeted your post </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div> </div>
{{template "status" (WithContext .Status $.Ctx)}} {{template "status" (WithContext .Status $.Ctx)}}
</div>
</div>
{{else if eq .Type "favourite"}} {{else if eq .Type "favourite"}}
<div class="notification-like-container"> <div class="retweet-info">
<div class="status-profile-img-container">
<a class="img-link" href="/user/{{.Account.ID}}"> <a class="img-link" href="/user/{{.Account.ID}}">
<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="profile-avatar" /> <img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
</a> </a>
</div>
<div>
<div class="notification-info-text">
<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span> <span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>
<img class="icon" src="{{GetIcon "liked" $.Ctx.DarkMode}}" alt="liked" /> <img class="icon" src="{{GetIcon "liked" $.Ctx.DarkMode}}" alt="liked" />
<span> liked your post </span> <span> liked your post </span>
<span>
- <time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}">{{TimeSince .CreatedAt}}</time>
</span>
</div> </div>
{{template "status" (WithContext .Status $.Ctx)}} {{template "status" (WithContext .Status $.Ctx)}}
</div>
</div>
{{end}} {{end}}
</div> </div>
{{end}} {{end}}

View File

@ -14,15 +14,12 @@
{{block "status" (WithContext . $.Ctx)}} {{block "status" (WithContext . $.Ctx)}}
{{with $s := .Data}} {{with $s := .Data}}
<div class="status-container status-{{.ID}}" data-id="{{.ID}}"> <div class="status-container status-{{.ID}}" data-id="{{.ID}}">
{{if not .HideAccountInfo}}
<div class="status-profile-img-container"> <div class="status-profile-img-container">
<a class="img-link" href="/user/{{.Account.ID}}"> <a class="img-link" href="/user/{{.Account.ID}}">
<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" /> <img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
</a> </a>
</div> </div>
{{end}}
<div class="status"> <div class="status">
{{if not .HideAccountInfo}}
<div class="status-name"> <div class="status-name">
<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span> <span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>
<a href="/user/{{.Account.ID}}" > <a href="/user/{{.Account.ID}}" >
@ -43,7 +40,6 @@
<img class="icon" src="{{GetIcon "link" $.Ctx.DarkMode}}" alt="source" /> <img class="icon" src="{{GetIcon "link" $.Ctx.DarkMode}}" alt="source" />
</a> </a>
</div> </div>
{{end}}
<div class="status-reply-container"> <div class="status-reply-container">
{{if .InReplyToID}} {{if .InReplyToID}}
<div class="status-reply-to"> <div class="status-reply-to">