This also introduces a combo grid/flex layout, which will also be
applied to the DM and Streams headings.
Because there are now multiple classes referenced from the
Puppeteer tests, those selectors now include the expanded
navigation area's parent ID selector.
This commit replaces all previous Font Awesome references in the
left side bar and relevant popovers with the custom Zulip star
icon.
Co-Authored-By: Hardik Dharmani <Ddharmani99@gmail.com>
This commit renames the classes and IDs in the views area
(formerly global filters) to a set of flexible values all
prefixed in some way with `left-sidebar-navigation`.
This is meant to make the styles and structures in the area
more readable, while also keeping things flexible into the
future as this area's elements change.
Co-Authored-By: Hardik Dharmani <Ddharmani99@gmail.com>
This fixes a regression introduced in #26807, where a padding
adjustment spilled over to the privacy icon display in message
headers.
This fix should prevent future spillover by isolating left-sidebar
stream icon styles to just the streams list.
This commit includes fixes to satsify vertical alignment, which is
now solely handled by CSS Grid. The commit also consolidates styles
and selectors for the sake of both necessity and readabilty.
This seems to more accurately express the current, desired behavior
in topics lists, but it is a necessity for moving the vdots into
the topic box (otherwise, vdots clicks simultaneously register on
the topic box itself).
This shifts the 8px of margin to the wrapper, preserving the space
to the right of the + icon, but no longer allowing it to shift the
hover state or trigger the tooltip when clicking actually activates
the search filter.
Fixes#11494 (at least the one fixable part; the rest should be
closed as wontfix)
This expresses the colors for vdots icons in just three variations,
all as CSS variables. The colors are all derived from the existing
design, and the dots colors in the streams/topics area was used as
as reference. The only visual change here, then, is to the global
filters area, whose vdots were the outliers prior to this change.
The three variations are:
1. hint: for touchscreens where a :hover state is not available
2. visible: for all screens when a parent element is highlighted
3. hover: for when the vdots themselves are hovered
The selectors have been streamlined to use the .sidebar-menu-icon
utility class, and the hover-within-a-hover color on vdots is
expressed more directly, eliminating the need for
selector-specificity busting via !important.
Fixes: #20600
Added a show_unread_counts personal user setting to the
Settings > Display settings > Advanced section which
lets user choose whether he/she wants to see unread messages
count on the left sidebar for streams.
This setting have three options,
"All Streams" - This will show unread messages count for all
streams.
"Unmuted Stream" - This will be default option and it will
only show unread messages count for unmuted streams.
"No Stream" - This option will not show unread messages count
on any stream.
Fixes#24149
This commit adds the follow icon to the right end
(before the three-dot menu icon) of the topic list item
for followed topics.
The icon replaces '@' instead of showing both the '@' and "Follow"
icons in the case of unread mentions, as users don't care if they
are following a topic if they've got unread mentions there.
In a muted stream, the text color of followed topics in the topic list
is set to be similar to that of unmuted topics.
The reason is that the followed topic has a tier of interest above
being unmuted, so it shouldn't stay faded in the topic list.
This commit adds the CSS variable '--color-unmuted-topic-list-item'
for the unmuted topic's color in the topic list.
The color for both the light and dark themes is defined in
'zulip.css' and used in 'left_sidebar.css'.
This approach helps to remove the use of the selector 'unmuted_topic'
only for color definition in 'dark_theme.css'.
We use input-append class only for some search elements
in the app and the CSS rules applied by bootstrap which
are really used are "white-space" and "margin-bottom"
for a couple of ".input-append" elements and "margin-left"
property on clear button which is re-added to the CSS for
specific elements in this commit.
Others are either redundant or overridden by the other CSS
for the specific elements.
The border-radius property for the clear button was applied
but since we use "x" for it, there is no border for that
button and hence it is redundant.
We don't have 800 font weight available, so the font weight defaults
to 700, so we use it directly here to avoid any changes when
we convert to variable font.
When there are only muted unread mentions in a stream, show `@` icon
and unread count in faded style, also align the `@` on more topics
with no unead counter on it.
If there are only muted unread messages without mentions don't show
the unread counter on the stream.
Fixes#25382.
This commit introduces structures and logic to hide the Scheduled
messages item from the left sidebar if there are no messages
scheduled to be sent.
Test coverage has been added for counts and visibility, too.
Fixes: #25101
When all the unread messages in a muted stream are in specifically
muted topics, this ensures that the total unread count for the stream
that the user sees before clicking "more topics" will match the total
unreads number for the stream itself.
This behavior is limited to muted streams, since in a normal / not
muted stream, we don't display a "muted topics only" faded unread
count by the stream's summary line to avoid distracting the user with
it, we match that behavior for the "more topics" line.
We also now display the `@` , again to ensure the stream's summary
line never displays an `@` without some topic row having one.
This commit fixes the opacity of the group-icon and bot-icon
in the left-sidebar direct message section to make them look
more consistent with the other icons in the left sidebar.
This fixes the bug where the schedule message whole row was not clickable
and had some padding issues. By adding same styles as all other rows in
left sidebar we eliminate those bugs.
If there are unread_mentions in unmuted topic in muted stream then,
show `.subscription_block unread_mention` in regular font not faded.
An additional parameter is passed to the update_count_in_dom function
to add or remove the "has-unmuted-mentions" class from the
.subscription_block, allowing for the relevant CSS to be applied to
display the unread mentions in regular font.
Fixes part of #24243.
This commit implements a new logic to display unread messages count
in muted streams. If there are any unread messages in unmuted topics
within a muted stream, the unread counter for the stream will display
the total count of all the unread messages in the unmuted topics.
The counter will be shown in regular font (not faded).
Fixes part of #24243.
Co-authored-by: Tim Abbott <tabbott@zulip.com>
Add class unmuted_topic to li.bottom_left_row element if topic is
unmuted. Add relevant CSS for .unmuted_topic to display unmuted
topics in regular font.
Fixes part of #24243.
Previously, muted streams in the left sidebar were faded using
opacity: 0.5, and on hover, the opacity was increased to 0.75.
This opacity was applied to all elements within the muted stream,
including the stream-privacy icon, names of the stream and topics
within, and the unread_count.
In this PR, we changed this behavior to handle opacity for each
element separately. We changed the opacity of the stream-privacy icon
and unread_count, while for the text (names of stream and topics),
we changed the alpha factor for the hsla color property.
The reason for this change is that we can have different opacity levels
for the unread_count and other elements. This will allow us to add
feature in next commits in this PR to set the opacity of unread_count
to 1 while keeping it at 0.5/0.75 for other elements in the case of
muted streams with unread messages in unmuted topics.
Fixes part of #24243
postcss-preset-env transpiles this back as necessary. (It does a
better job than we did, in fact: we had several four-argument hsl()
calls that should have been hsla().)
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Having active streams greyed out can be confusing to the user. This
is especially useful when the app is still fetching messages on
a reload and the active stream has no messages and is thus marked
as `inactive`.
Ever since we started bundling the app with webpack, there’s been less
and less overlap between our ‘static’ directory (files belonging to
the frontend app) and Django’s interpretation of the ‘static’
directory (files served directly to the web).
Split the app out to its own ‘web’ directory outside of ‘static’, and
remove all the custom collectstatic --ignore rules. This makes it
much clearer what’s actually being served to the web, and what’s being
bundled by webpack. It also shrinks the release tarball by 3%.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Karl Stolley
Lalit
Aman Agrawal
Prakhar Pratyush
Prakhar Pratyush
evykassirer
Daniil Fadeev
Sahil Batra
Lauryn Menard
Hardik Dharmani
evykassirer
Tim Abbott
palashb01
Anders Kaseorg