notifications layout

This commit is contained in:
Martti Malmi 2021-08-18 17:11:14 +03:00
parent 9e1084b95c
commit 94ccbe8100

View File

@ -22,7 +22,7 @@ export default class Notifications extends View {
renderView() { renderView() {
return html` return html`
<div class="centered-container"> <div class="centered-container public-messages-view">
<h3>${t('notifications')}</h3> <h3>${t('notifications')}</h3>
${Object.keys(this.notifications).length === 0 ? html` ${Object.keys(this.notifications).length === 0 ? html`
<p>No notifications yet</p> <p>No notifications yet</p>
@ -30,15 +30,20 @@ export default class Notifications extends View {
${Object.keys(this.notifications).sort().reverse().map(k => { ${Object.keys(this.notifications).sort().reverse().map(k => {
const notification = this.notifications[k]; const notification = this.notifications[k];
return html` return html`
<p> <div class="msg">
<small>${iris.util.formatDate(new Date(notification.time))}</small><br/> <div class="msg-content">
<a href="/profile/${notification.from}"> <div class="msg-sender">
<${Identicon} str=${notification.from} width=30 />${' '} <a class="msg-sender-link" href="/profile/${notification.from}">
<${Name} pub=${notification.from} /> <${Identicon} str=${notification.from} width=30 />${' '}
</a> <small class="msgSenderName"><${Name} pub=${notification.from} /></small>
${notification.action === 'like' ? ' liked ' : ' replied to '} </a>
<a href="/post/${encodeURIComponent(notification.target)}">your post</a> </div>
</p> <a href="/post/${encodeURIComponent(notification.target)}">${notification.action === 'like' ? 'liked' : 'replied to'} your post</a>
<div class="below-text">
<div class="time">${iris.util.formatDate(new Date(notification.time))}</div><br/>
</div>
</div>
</div>
`; `;
})} })}
</div> </div>