Need help with chat notifications, template

[Ne Ho]

Hello,

I have forked theme-material and i try to figure out how I should make my chat notifications show up when there is a new message.

The notification is not showing up if I am not on the forum, when I close the browser (send a message while it is closed from another user) and visit my forum I can not see that there is a new message, it is only visible in the dropdown menu as highlighted, but the count is not visible.

When i am on the forum and somebody sends a message than everything works as it should, I can see the "{unreadCount.chat}"

if i change the line to be like in the persona theme

https://github.com/NodeBB/nodebb-theme-persona/blob/77962c81bab538f6cd82c98451019da0c7a6d391/templates/partials/menu.tpl#L52

then it also shows up when the number of not seen messages is 0, the count is always visible

if i replace that line with this one

<i component="chat/icon" class="fa fa-comment-o fa-fw" data-content="0"></i>

then the notification wont show up

Could somebody point me out what the right way is to change this line?

This is how I would like to see the notification when I visit my forum

[jtsimoes]

I'm not sure if Material theme keeps the variables equal to the Persona theme, but you need this class on your CSS to not show up any number when your data-content is 0 or null/empty:

.unread-count[data-content]:not([data-content=""]):not([data-content="0"]):after {
	content: attr(data-content);
}

And your line now should be:

<i component="chat/icon" class="fa fa-comment-o fa-fw unread-count" data-content="{unreadCount.chat}"></i>

[Ne Ho]

@jtsimoes said in Need help with chat notifications, template:

will check the class, thank you I let you know

[Ne Ho]

Thank you very much, it worked, I had to modify the class .unread-count:after what I already had defined and to add the .unread-count as you have suggested