This commit, adds the `.popover-menu-tab-group` class to the tab pickers
that appear together with the other popover menu options and thus
need to match their spacing and margins for a uniform look.
This removes the need to maintain a cluttered list of tab pickers that
need to be styled as such in the `popovers.css` file.
As part of the popover menu redesign, this updates the topic visibility
popover to use the new "popover-menu" popover theme and improves
accessibility by using appropriate ARIA attributes.
This also moves the `:focus-visible` CSS rule to apply to any tab
picker in a popover, removing the need to explicitly add it to each
tab picker.
Fixes part of #28699.
Create has:reaction search operator and search suggestions.
Create sidebar view for the user to view their messages that
have reactions using has:reaction sender:me operators.
Add custom heading for the view and tooltip in the sidebar.
Add documentation for the new operator.
Fixes: #27328.
This commit updates the sidebar topic actions popover to use the new
sliding tab switcher for the topics visibility policy switcher.
This also includes changes such as hiding the popover only on
successful request completion, and adds error feedback by indicating
it via the sliding animation.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="group"` to the topic visibility picker, identifying it as a
container for related menu items.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="group"` to the theme switcher, identifying it as a container
for related menu items.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
This refactors popover list structure to use a flattened `ul > li`
structure along with aria-related additions, enabling screen reader
accessibility and announcing menu length and position (`# of n`).
Added ARIA roles:
- `role="menu"` to the parent `<ul>` element, indicating it is a widget
offering a list of choices.
- `role="menuitem"`, `role="menuitemcheckbox"`,
or`role="menuitemradio"` to child elements based on their function.
- `role="none"` to `<li>` elements, removing the implied `listitem`
role that conflicts with the parent menu structure.
Also removes the unused `should_display_reminder_option` code, which
should have been removed in f40855bad2.
We use "prop-element" class only to handle save-discard widget
and not anywhere else, so there is no need to have this class
for elements that do not use save-discard widget.
For more discoverability, the keyboard shortcuts for preview, and bold,
italic and link formatting are now displayed in the tooltips of those
compose buttons.
Updates the base hash for the streams setting overlay to be
"channels" instead of "streams".
Because there are Welcome Bot and Notification Bot messages that
would have been sent with the "/#streams" hash, we will need to
support parsing those overlay hashes as an alias for "/#channels"
permanently.
Part of the stream to channels rename project.
Updates a chunk of translated strings that overlap between files,
with the streams settings overlay being the starting point for
finding these strings, to use channel instead of stream.
Part of stream to channel rename project.
This fixes the bug where on hovering / selecting an emoji picker search
results emoji, invariably its canonical name would show / be used, which
is not always the same as the matching alias. For example, searching for
"swe" would show the "sweeping" emoji, but its canonical name is "broom"
which can be a confusing search result for "swe".
Following ca9b1060b7, we allow the content of popover menu items to
control the width of the popover.
While using `white-space: nowrap` works, we should instead use the
`max-content` intrinsic sizing so that, if necessary, we can still
provide a `max-width` to the popover which would then force the popover
menu content to wrap.
Display manage this user in the three-dot menu on the user card
regardless of is_active.
Similarly, display edit user icon in deactivated users list.
Do not hide edit button when user is deactivated.
Fixes#29486.
Now we show the number of drafts that are addressed to the current
recipient selected in the compose box, if any, in the Drafts button
within parentheses (whether it is next to the Send button, or in the
Send options popover), and explain that it is the number of drafts for
this conversation in the tooltip.
Fixes: #28696.
The read receipts option, resides under the triple-dot message actions
menu. This made the process of viewing the read receipts take up
multiple steps, even via a keyboard-driven workflow.
Via this commit, now while focused on any message in a message feed,
and pressing `Shift` + `V`, efficiently brings up the read receipts
for that message.
Fixes part of #24716.
Co-Authored-by: SameepAher <sameepaher@gmail.com>
This commit tries to improve the CSS related to the emoji picker by
restructuring relevant parts of `reactions.css` and `dark_theme.css`.
Via this commit, the redundant classes -- "reaction", "status-emoji",
"composition" are also removed from `emoji_popover_emoji.hbs`.
If needed, specific styling -- according to the type of emoji picker,
can now be applied using the `data-emoji-destination` attribute of the
`.emoji-picker-popover`.
Due to a logical bug in the `process_enter_while_filtering` function,
the `toggle_reaction` was being called when pressing enter while
filtering the emojis in the status emoji picker.
This commit fixes the above bug, while also adding some cleanups to the
`emoji_picker.js` by combining multiple click handlers and aggregating
all the logic related to an emoji being selected into a common function.
Fixes#28464.
This commit updates the user group popovers to change the icon
and text of ".manage-group" option to match what we have in
gear menu and also change the heading and ".manage-group"
option to be left-aligned.
We now add a "Group settings" option in the gear menu to open
the new "#groups" UI and the "Manage group" option in user
group popover also opens the new UI.
Note that toggling off spoiler formatting works if either all the
content inside, or the header (if it exists) or both are selected.
Co-authored-by: N-Shar-ma <bablinaneh@gmail.com>
Note that toggling off, only works for code blocks without a specified
language. So toggling formatting off only works for code blocks like:
```
code
```
and not:
```javascript
code
```
Co-authored-by: N-Shar-ma <bablinaneh@gmail.com>
This is a preparatory commit for new formatting buttons which are added
in the following commits.
Earlier we used multiple classes, each of which handled the hiding or
showing of the element it was applied to, at each breakpoint. Now all
the media queries of those classes have been combined into a new class,
for cleaner and more reusable code. This new combined media query is
also updated to accommodate the new formatting buttons.
We need to use the `navigate-link-on-enter` class for the scheduled
messages link in the popover, since it's a popover menu item with a
`href` attribute. The reason for using this class has been documented
in 246c1d7b4e.
Since focus on input elements on mobile opens keyboard which
changes window height, emoji popover can hide or scroll out of
view. To fix it, we don't focus on search input unless user
wants to when emoji popover is open.
This commit renames default_view and escape_navigates_to_default_view
settings to web_home_view and web_escape_navigates_to_home_view in
database and API to match with our recent renaming of user facing
strings related to this.
We also rename the variables, functions, comments in code and class
names and IDs for elements related to this.
This commit adds code to add "(guest)" to user names of guest
users in the following places -
- right sidebar
- user pills, including the pills in search suggestion typehaead
- typeaheads for user
- sender names in message feed
- user profile popover and modals.
- user name in not subscribed warning banner.
Note that the indicator is shown only if enable_guest_user_indicator
setting is set to true.
As a result of this change, we now translate "deactivated" text
shown in user pills for deactivated users.
Fixes part of #26700.
`popover-content` class had no effect on emoji popover since
it was resetting `padding: 0` and background color was
already applied by tippy theme.
In short, removing `popover-content` had no visual changes.
Remove bootstrap-tooltip class `popover-title` from code.
It was only used in user_card_popover for showing user avatar,
so cleaned up properties that were duplicated or not required.
Sayam Samal
Sayam Samal
Kenneth Rodrigues
sujal shah
Sahil Batra
N-Shar-ma
Lauryn Menard
CIC4DA
evykassirer
nimishmedatwal
Kenneth Rodrigues
Alya Abbott
shashank-23002
Julia Bichler
Karl Stolley
Aman Agrawal
Prakhar Pratyush