paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 04:52:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

left_sidebar: Show home unread count in condensed views.

Browse Source 
The view is left as-is, however, for users who prefer
masked unreads.
This commit is contained in:
Karl Stolley
2025-07-31 15:23:21 -05:00
committed by Tim Abbott
parent 070f497785
commit b27a9fdbf1
3 changed files with 52 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/left_sidebar_navigation_area.ts
View File

@@ -96,10 +96,12 @@ export function update_dom_with_unread_counts(
// mentioned/home views have simple integer counts
const $mentioned_li = $(".top_left_mentions");
const $home_view_li = $(".selected-home-view");
const $condensed_view_li = $(".top_left_condensed_unread_marker");
const $back_to_streams = $("#topics_header");
ui_util.update_unread_count_in_dom($mentioned_li, counts.mentioned_message_count);
ui_util.update_unread_count_in_dom($home_view_li, counts.home_unread_messages);
ui_util.update_unread_count_in_dom($condensed_view_li, counts.home_unread_messages);
ui_util.update_unread_count_in_dom($back_to_streams, counts.stream_unread_messages);
const pinned_unread_counts: SectionUnreadCount = {

73
web/styles/left_sidebar.css
View File

@@ -949,35 +949,37 @@ li.active-sub-filter {
/* Set a positioning context for the unread dot. */
position: relative;
.unread_count {
position: absolute;
}
/* Show the same styles when each item is
hovered or, via the keyboard, the `<a>`
element within receives focus. */
&:hover,
&:focus-within {
background: var(--color-background-navigation-item-hover);
&:not(.top_left_condensed_unread_marker) {
.unread_count {
/* 6px at 12px/1em */
top: -0.5em;
right: -0.5em;
background: var(--color-background-unread-counter-no-alpha);
position: absolute;
}
}
&:not(:hover) .unread_count {
/* .unread_count has its based font-size set to 12px at 14px/em. */
/* 2px, 6px at 12px/1em */
top: 0.1667em;
right: 0.1667em;
width: 0.5em;
height: 0.5em;
padding: 0;
color: transparent;
background-color: var(--color-background-unread-counter-dot);
/* Show the same styles when each item is
hovered or, via the keyboard, the `<a>`
element within receives focus. */
&:hover,
&:focus-within {
background: var(--color-background-navigation-item-hover);
.unread_count {
/* 6px at 12px/1em */
top: -0.5em;
right: -0.5em;
background: var(--color-background-unread-counter-no-alpha);
}
}
&:not(:hover) .unread_count {
/* .unread_count has its based font-size set to 12px at 14px/em. */
/* 2px, 6px at 12px/1em */
top: 0.1667em;
right: 0.1667em;
width: 0.5em;
height: 0.5em;
padding: 0;
color: transparent;
background-color: var(--color-background-unread-counter-dot);
}
}
&.top_left_starred_messages .unread_count {
@@ -985,6 +987,25 @@ li.active-sub-filter {
}
}
&.hide-unread-messages-count {
/* We suppress the entire unread area
for users who prefer masked unreads. */
.top_left_condensed_unread_marker {
display: none;
}
}
.top_left_condensed_unread_marker {
display: flex;
align-content: center;
.unread_count {
flex: 0 0 auto;
margin: 0 var(--left-sidebar-unread-offset);
align-self: center;
}
}
.left-sidebar-navigation-icon-container {
/* Unset margin from full nav list anchor elements. */
margin: 0;

3
web/templates/left_sidebar.hbs
View File

@@ -8,6 +8,9 @@
{{#each primary_condensed_views}}
{{> left_sidebar_primary_condensed_view_item . }}
{{/each}}
<li class="top_left_condensed_unread_marker left-sidebar-navigation-condensed-item">
<span class="unread_count normal-count"></span>
</li>
</ul>
<div class="left-sidebar-navigation-menu-icon">
<i class="zulip-icon zulip-icon-more-vertical" aria-label="{{t 'Other views'}}"></i>