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.
Fixes#28526
* Removed `container` and `row-fluid` class from error pages.
* Use a variable for footer height.
* Made header sticky instead of fixed allowing us to position
page content without adding arbitrary padding or margin at top.
Header is around 60px in height, so reduced that much top padding
or margin.
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.
Also removes the unused `should_display_reminder_option` code, which
should have been removed in f40855bad2.
We still had some code in invite.ts for the textarea element
which was replaced by pill container, so this commit removes
that code.
This commit also removes the CSS for textarea and radion buttons
which are no longer present in the UI.
When input pills are hovered, the 'x' button is highlighted.
This commit ensures that 'x' button is highlighted only if the
'x' button is hovered, not anywhere else on the pill.
Author: ecxtacy <dc.dhruvchouhan@gmail.com>.
This commit refines word wrapping in user profile popovers. It implements 'overflow-wrap: break-word;' for category ‘name’ items (e.g., ‘Email’, ‘User ID’) and 'overflow-wrap: anywhere;' for category ‘value’ segments, ensuring proper line breaks and preventing overflow issues. Additionally, addressed prettier problems to maintain code consistency.
Fixes#22865
Updates instances of default-streams-list to instead be
default-channels-list as the data-section for the organization
settings overlay is part of the URL hash.
This commit fixes the margins around banner for default stream
subscriptions, shown to users who cannot subscribe others, to
be same as that for other banners like the one shown when
description is not set for the organization.
Fixes#30083.
We have used the dark theme color for the left sidebar row hover:
`--color-background-active-narrow-filter`. We are not using that variable
directly since we don't want a change in that color affecting the color in
recent conversations.
We've also used a single color on hover compared to 2 different colors
for unread and read row before. Light mode also uses a single color on
hover.
Relevant CZO conversation:
https://chat.zulip.org/#narrow/stream/101-design/topic/Hover.20color.20in.20Recent.20conversations.20dark.20mode.2E/near/1797727
Adds description in views styled like stream descriptions also adds a
help center link to the appropriate page at the end of each
description.
Fixes#29769.
Earlier, the compose textarea and the preview (container) occupied the
same grid area, 1 at a time. Now, they are both children of a common div
which is assigned the same grid area. This allows adding more elements
to the same grid area in the future.
This is purely a code change and should have no visible effects.
This is a prep commit for relocating the compose expand / collapse
buttons to the top right inside corner of the textarea / preview.
The `margin-bottom` was removed for the last element in the preview in
e55f5a1b59 to remove vertical shifts when
toggling preview mode, but it is not needed for image / video previews,
so now `margin-bottom` is not set to 0 for the last inline preview.
e.target is the wrong element, and even if this were to successfully
add the _full-height-no-scroll class to <body>, that’s not a child of
.portico-hello-page.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
We now use "settings-field-label" and "modal-field-label"
class on label elements in settings and modals respectively
to add the bottom margin which was previously done by
"dropdown-title" class as it is better to have more
generic names to use on label for all type of inputs.
This commit adds bottom margin to label elements of
different inputs by adding "modal-field-label" class
to the label elements. Some of them already have the
margin due to having dropdown-title class.
This removes the common min-width being used across all popovers and
instead sets the min-width according to a popover's requirements.
This allows for greater control over the popovers since we have a
variety of use cases for them — which a single common min-width cannot
accommodate.
Additionally, the text colors have been updated for both light and dark
themes, it starts showing when 900 or less characters are left, as 999
was too soon, and has a tooltip to show the maximum characters limit.
Fixes: #28706.
Earlier, the primary modal button always turned grey on being disabled,
while other modal buttons remained as is in light mode, and grey in dark
mode. Now the styling is made consistent across all modal buttons, by
giving them all 50% opacity when disabled.
So far, the Send buttons area would turn grey when the message could not
be sent. The Save button when editing a message would also turn grey
when the message could not be edited anymore. Now we simply make the
buttons half opaque instead of turning them grey in a disabled state.
We change the background colors for the close / cancel / exit buttons
in modals and messages (when editing them or viewing their source). The
border is also removed for those buttons in messages.
When viewing the source of a message when not editable, the opacity of
the read-only textarea would be reduced to 0.5, like for any other read-
only textarea in dark mode. This was unnecessary for viewing message
source, so the opacity for this case is now set to 1.
Fixes: #28701.
Sayam Samal
Aman Agrawal
Lauryn Menard
Karl Stolley
Tim Abbott
sanchi-t
Anders Kaseorg
Sahil Batra
ecxtacy
Isabela Pereira
Shubham Padia
nimishmedatwal
N-Shar-ma
Prakhar Pratyush
Pratik