Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

recent-topics: Mark as read using unread counters in Recent topics. 

The PR changes the following behaviors and UI:
1. Removes the checkmark button to mark the topic as read in
"Recent Topics".
2. Make the unread messages counter be the button for marking
all messages in the topic as read. The unread messages counter
is made clickable and tooltip is set to "Mark as read".

In "recent_topic_row.hbs", remove the checkmark button and add
classes and attributes to ".unread_counter" to give it desirable
behaviour on clicking.

In "zulip.css" set "opacity: 0.7" for ".on_hover_topic_read".

In "recent_topics.css" we set the background-color of unread counter to
hsl(105, 2%, 50%) to decrease fading of unread counter.

Fixes: #21654
This commit is contained in:
NerdyLucifer 2022-04-22 04:19:05 +05:30 committed by Tim Abbott
parent 426f8ce385
commit c31ab1bcb5
3 changed files with 3 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
static/styles/recent_topics.css
View File

@ -144,6 +144,7 @@
margin-right: 10px;
margin-left: 10px;
align-self: center;
background-color: hsl(105, 2%, 50%);
}
.unread_hidden {

2
static/styles/zulip.css
View File

@ -1374,6 +1374,7 @@ td.pointer {
}
.always_visible_topic_edit,
.on_hover_topic_read,
.on_hover_topic_unmute {
opacity: 0.7;
@ -1384,7 +1385,6 @@ td.pointer {
}
.on_hover_topic_edit,
.on_hover_topic_read,
.on_hover_topic_unresolve,
.on_hover_topic_resolve,
.on_hover_topic_mute {

5
static/templates/recent_topic_row.hbs
View File

@ -13,7 +13,7 @@
<a href="{{topic_url}}">{{topic}}</a>
</div>
<div class="right_part">
<span class="unread_count {{#unless unread_count}}unread_hidden{{/unless}}">{{unread_count}}</span>
<span class="unread_count {{#unless unread_count}}unread_hidden{{/unless}} tippy-zulip-tooltip on_hover_topic_read" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tippy-content="{{t 'Mark as read' }}" role="button" tabindex="0" aria-label="{{t 'Mark as read' }}">{{unread_count}}</span>
<div class="recent_topic_actions">
<div class="recent_topics_focusable hidden-for-spectators">
{{#if topic_muted}}
@ -22,9 +22,6 @@
<i class="fa fa-bell-slash on_hover_topic_mute recipient_bar_icon tippy-zulip-tooltip" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tippy-content="{{t 'Mute topic' }}" role="button" tabindex="0" aria-label="{{t 'Mute topic' }}"></i>
{{/if}}
</div>
<div class="recent_topics_focusable hidden-for-spectators">
<i class="fa fa-check-circle on_hover_topic_read recipient_bar_icon tippy-zulip-tooltip" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tippy-content="{{t 'Mark as read' }}" role="button" tabindex="0" aria-label="{{t 'Mark as read' }}"></i>
</div>
</div>
</div>
</div>