1
0
mirror of https://github.com/flarum/core.git synced 2025-07-19 07:41:22 +02:00

Implement third state for notification list dropdown

Related to #500.
This commit is contained in:
Franz Liedke
2015-09-29 00:50:28 +02:00
parent da4dad3bb8
commit a436bef93c
2 changed files with 16 additions and 4 deletions

View File

@@ -27,11 +27,12 @@ export default class NotificationsDropdown extends Dropdown {
}
getButton() {
const unread = this.getUnreadCount();
const newNotifications = this.getNewCount();
const vdom = super.getButton();
vdom.attrs.title = this.props.label;
vdom.attrs.className += (unread ? ' unread' : '');
vdom.attrs.className += (newNotifications ? ' new' : '');
vdom.attrs.onclick = this.onclick.bind(this);
return vdom;
@@ -69,6 +70,12 @@ export default class NotificationsDropdown extends Dropdown {
}
getUnreadCount() {
return app.cache.notifications ?
app.cache.notifications.filter(notification => !notification.isRead()).length :
0;
}
getNewCount() {
return app.session.user.unreadNotificationsCount();
}

View File

@@ -24,14 +24,15 @@
}
}
.NotificationsDropdown .Dropdown-toggle.unread .Button-icon {
.NotificationsDropdown .Dropdown-toggle.new .Button-icon {
color: @header-color;
}
.NotificationsDropdown-unread {
position: absolute;
top: 1px;
left: 17px;
background: @header-color;
background: @control-color;
color: @header-bg;
font-size: 11px;
font-weight: bold;
@@ -41,4 +42,8 @@
border: 1px solid @header-bg;
min-width: 18px;
height: 18px;
.new & {
background: @header-color;
}
}