Fixes#22911
`Back to streams`, stream name and filter topics are all sticky
now and their color changes based on which filter is active and
the currently applied theme.
Previously, when you clicked the confirmation button in a
dialog_widget, we'd display a loading spinner on top of an ugly grey
button background.
Remove the ugly grey background color, while making sure the loading
spinner inside the button looks good and doesn't resize the button.
Fixes: #22002
The blue font color on the vote_text beside the reactions in
light mode made it seem like a link which it's not, so it has
been changed to regular font color.
We preserve the blue font color on hover, matching the add-reaction
button.
This fixes a bug where in narrow windows, long vote_text could extend
beyond the body of the reaction's allocated area.
It also provides a matching right margin around the count/name inside
the reaction pill, which looks better when we have strings inside them.
This commit introduces the change of rendering private messages
section as collapsible, whose data-fetching logic came with zulip#21357.
We now have separated out `Private messages` from `top_left_corner`
section and shifted it below the `global_filters` in a different
separate section along with stream list with common scroll bar
in left-sidebar.
The new PM section will be opened by-default on loading the page
and will have a toggle-icon in its header, clicking on which makes the
section collapse/expand accordingly.
In default view, only recent 5 PM threads would be shown
and would append the active conversation as the 6th one at last
if not present in those 5, similar to how topics list work.
In PM section with unreads, a maximum of 8 conversations
would be shown and rest of them would be hidden behind
the 'more conversations' li-item, clicking on which takes
to the zoomedIn view of PM section where all the present
PM threads would be visible and rest of the sections of left-sidebar
will get collapsed.
Fixes#20870.
Co-authored-by: Aman Agrawal <amanagr@zulip.com>
Now that we show the \vdots icon while the actions popover is open,
there's a weird looking behavior where a focus outline appears around
the \vdots icon, only if you clicked on the icon itself, not its
square containing click arrow.
Disable this unintended behavior, which disrupts the otherwise
simulated state where focus is in the popover (but no row is focused).
The color for the message control buttons is set in the
`message_control_button` class. The `reaction_button_visible` class
also sets a color declaration with the same value.
This commit removes this declaration because it doesn't change the
color of the reaction icon(the class is currently only used in
conjunction with `message_control_button` to toggle the button
visibility) nor does it override any inherited style (hover color
remains the same regardless) as it lacks an `!important` rule.
This commit fixes the issue where the 3-dots menu icons on the left
sidebar disappear even though the associated popover is open by
toggling a special CSS class on the menu item. It follows the same
approach used by the emoji picker on the message feed UI.
Fixes #23157
This commit enables the 3-dot menu to be visible while the associated
actions popover is open using the fact that the 'has_actions_popover'
class is attached to the message with an open popover. This approach
solves the bug without any additional JavaScript code.
Fixes part of #23157
Previously, we had some special CSS for the user profile modals in the
case that there were no custom profile fields, to do things like hide
the <hr> divider between the normal profile fields and custom ones.
The design has for some time treated custom profile fields as just
additional profile fields; so there's no longer a need for custom CSS.
While going through the full profile of a user, we expect to find
that specific user's in-depth details. Thus, we should have a fixed
title displaying the name at the top of the modal to establish the
connection of the profile data with the user.
We also fix the tab switcher between "Profile/Streams/User groups" to
the top of the modal, for the added convinience of switching across
the three options at any point of time.
Fixes#22984
Add an `@` icon in unread topics where user is mentioned.
We track a new set of `stream_id:topic` pairs for the unread mentions
so that recent topics instantly knows if a topic is unread and mentioned
or not.
We seem to override this setting for most of the dropdowns, so this
common CSS only applies to the smaller dropdown shown to logged-in
users, where it was weirdly wide.
User's name with status emoji was overflowing its container,
resulting in overflown text to not be converted into ellipsis
and pushing status emoji out of visible area.
This commit adds private messages to the Recent topics view, to make
it an all-encompassing overview of recent activity visible to the user.
We add a filter "Include PM" to toggle whether PMs should be shown in
recent topics.
Fixes#19449.
This is not the right fix for this, but a temporary adjustment
to make it look good with minimal impact on other languages and
other pages.
Right fix would require changing the structure of the button, which
was not easy to do and make it look similar to how it looks now.
It was not possible to scroll to the bottom of the list on
narrow-width when only single column was displayed on the
settings overlay. This commit fixes the height of the sidebar
and set to "100% - height of header - height of tab-container"
which fixes the scroll behavior.
This is not a issue for two-column overlay where height is set
to "100% - height of header" (the tab-container is already
inside the header).
This duplicates some CSS to avoid using "!important". While doing
this duplication, we remove "margin: 0" and "display: block" since
these are already set as default values.
Fixes#22876.
There is some old CSS that was only being applied to some buttons
and not others. This deletes those lines so that only the opacity
changes on hover and not also the color.
Following up from #23059.
We now disable the topic or stream input in move message modal if
user is not allowed to edit them. Topic input can be disabled only
in the modal opened from message actions popover since permission
to edit topic depends on message and we do not have any message
when we open topic from left sidebar since the message is fetched
from server while submitting.
This commit also does some changes to call ".trim()" on new_topic_name
only when it is undefined. new_topic_name can be undefined when
the new topic input is disabled because "serializeArray" only
considers enabled inputs.
Following the addition of support for custom profile fields in the
user info popovers, we redesign the popover to have a cleaner look.
* Switch top section design from centered to left-aligned.
* Move mute/unmute and manage user options behind a \vdots menu.
* Move the local time and status into a new block.
Almost all design changes ideas are from discussion on chat.zulip.org;
see "#design > pronouns in profile card" for details.
Co-authored-by: evykassirer <evy.kassirer@gmail.com>
Co-authored-by: Tim Abbott <tabbott@zulip.com>
Because some button text is much longer in different languages,
there is an existing bug when the charts are rendered with the
range selector buttons positioned on the right side of the chart.
This positions the range selector buttons to the left side of the
chart and the hover information to the right side of the chart.
For the pie charts and horizontal bar chart, the grouping buttons
labeled "Me" and "Everyone" are moved to the top of the chart, which
matches the grouping buttons on the vertical bar charts.
Adjusts some chart margins for new positioning of buttons and hover
information. Deduplicates some shared code for rangeselector buttons
in `stats.js` for the three vertical bar charts.
This was a regression introduced in the commit
a80500cf5d
where we forgot to change the color of for unread PM date rows
while change the color for the date row of unread stream messages.
We already offer this for stream messages, but had been blocked on
adding it for private messages for visual design reasons. The dark
theme had a natural place to put this, since it had a box around the
private message recipient box; but the light theme didn't.
We add a border to the light theme private message recipient box to
allow us to add the same button to private messages, and implement
that button.
Fixes#21962.