Forum Discussion

sherrie's avatar
sherrie
Leader
8 years ago

Different CSS for Unread Topics

I noticed when we switched to responsive that we no longer have any indication of which topics have unread messages. We had users that would visit the All Topics page and then look to see which ones ...
  • ClaudiusH's avatar
    ClaudiusH
    8 years ago

    Hey Sherrie,

     

    On board level (and most message lists that contain a topic title) there's a <span class="lia-message-unread"> which can be used e.g. to put all unread topic links in bold

     

    .lia-content .lia-message-unread.lia-message-unread.lia-link-navigation, 
    .lia-content .lia-message-unread.lia-message-unread > .lia-link-navigation {
    font-weight: bold;
}

     Alternatively the Skype Community added the familiar orange unread dot behind each conversation:

    .lia-message-unread:after {
    margin-left: 7px;
    content: "●";
    color: #FFB200;
}

     

Cloud_Spanner's avatar
Cloud_Spanner
Leader

Claudius I am tryin to understand if this is just for the topic level or if it's also for the message level. 

I can see how Khoros has a read vs unread setting at each comment level. How does this translate into the UI? 

The scenario I am trying to solve for is: A power user will want to know if there are unread comments on a topic that they have already viewed. 

AndrewF's avatar
AndrewF
Khoros Oracle
3 years ago
Cloud_Spanner wrote:

The scenario I am trying to solve for is: A power user will want to know if there are unread comments on a topic that they have already viewed. 

The subject will have the lia-message-unread class if there are any unread messages in the thread.

This functionality is related to the image that can denote threads as being "read by moderators" (or not) to indicate where mods might want to spend attention. So it should work by the same rules as that image.

I believe in some layouts there is also the ability to show a column of the number of unread messages in a thread. Unfortunately I can't remember the details about how to enable that column, but someone else may know.