Commit Graph

1399 Commits

Author SHA1 Message Date
Karl Stolley d8a73c8637 left_sidebar: Set navigation area rows to em-based line-height. 2024-05-31 15:18:06 -07:00
Karl Stolley ef68132a5a left_sidebar: Declare header row-heights as prominent rows. 2024-05-31 15:18:06 -07:00
Karl Stolley 4405136ffb info_density: Declare em-based line-height vars for sidebar rows. 2024-05-31 15:18:06 -07:00
Karl Stolley 3d04f7dbda info_density: Set a minimum line-height on body. 2024-05-31 15:18:06 -07:00
Tim Abbott 097066f412 Revert "recent_topics: Change background color in dark mode on hover on a row."
This reverts commit 4ee37244bb.

This was not found to be uniformly agreed as an improvement.
2024-05-28 14:38:50 -07:00
sanchi-t ca74c95c60 user_profile: Display `Saved` feedback.
Visually confirms successful profile changes with a clear
`Saved` message.

Fixes part of #26692.

Co-authored-by: Kunal Sharma <v.shm.kunal@gmail.com>.
Co-authored-by: Angelica <angelica.ferlin@gmail.com>.
2024-05-28 14:34:57 -07:00
Karl Stolley 0884b96fc6 spoilers: Style headers in Markdown-neutral way. 2024-05-28 14:34:10 -07:00
Anders Kaseorg caf6387514 stylelint: Fix shorthand-property-no-redundant-values.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2024-05-26 19:20:10 -07:00
Sahil Batra 5e347e971d invite: Remove code for old UI.
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.
2024-05-25 17:48:48 -07:00
Karl Stolley 852637d3b3 left_sidebar: Convert stream-privacy icon sizes to ems. 2024-05-24 10:23:41 -07:00
Karl Stolley d5a5044ecd left_sidebar: Improve icon alignment in stream rows. 2024-05-24 10:23:41 -07:00
Karl Stolley dda75a56bc left_sidebar: Consolidate .stream-privacy styles. 2024-05-24 10:23:41 -07:00
Karl Stolley 20d6dd110a left_sidebar: Align more-topics indicator on topic grid. 2024-05-22 17:24:35 -07:00
Karl Stolley 50a7e3cf2c left_sidebar: Flatten renamed .sidebar-topic-name selector. 2024-05-22 17:24:35 -07:00
Karl Stolley 0fbdd02d87 compose: Tune send-controls vdots for narrowest viewports. 2024-05-22 11:36:28 -07:00
Karl Stolley ac6ac58385 compose: Strengthen layout in send-controls area. 2024-05-22 11:36:28 -07:00
Aman Agrawal 0d3e223493 compose: Fix formatting popover persists on wide screens.
Reproducer:

1. Make your window narrow, to get the `...` formatting buttons menu.
2. Open the menu.
3. Make your window wide again.
2024-05-21 14:56:00 -07:00
Anders Kaseorg b545abe1e2 typos: Fix typos caught by mwic.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2024-05-20 13:55:00 -07:00
ecxtacy ad177a8b48 css: Show 'x' button hover styling when hovered over 'x'.
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>.
2024-05-17 10:47:22 -07:00
Aman Agrawal 7203661d99 support: Set discounted price instead percentage for customers.
This allows us to set the price of a plan exactly as discussed with
the customer.
2024-05-16 02:18:43 -07:00
Isabela Pereira fee0470a97 popovers: Refine word wrapping in user profile.
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
2024-05-15 17:20:21 -07:00
Lauryn Menard 7a61044a03 org-settings: Update tab for default channel settings.
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.
2024-05-15 12:18:36 -07:00
Sahil Batra 6f5143b5b8 invite: Fix margins around subscriptions banner.
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.
2024-05-15 10:59:05 -07:00
Sahil Batra 016917679e invites: Do not show streams if user cannot subscribe others.
We do not show the streams list in invite modal if the user
does not have permission to subscribe others to stream and
show a notice mentioning it.
2024-05-14 14:20:07 -07:00
Shubham Padia 4ee37244bb recent_topics: Change background color in dark mode on hover on a row.
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
2024-05-14 11:46:37 -07:00
nimishmedatwal 941c5daf36 navbar: Describe views in top navbar.
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.
2024-05-13 17:56:30 -07:00
Aman Agrawal 80d19fe15d css: Fix theme switch changing color of elements at different intervals.
Due to these transitions the theme switch from dark <-> light was
not pleasant as the background color and color changed at different
intervals.
2024-05-13 13:21:10 -07:00
N-Shar-ma 1121d317c2 compose: Restructure HTML for common compose textarea/preview parent.
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.
2024-05-13 12:11:29 -07:00
Prakhar Pratyush bf2360bcf2 onboarding_steps: Remove hotspot as an onboarding_step.
Earlier, hotspots and one-time notices were the valid
type of onboarding step.

Now, one-time notice is the only valid type.

Fixes #29296.
2024-05-10 12:30:22 -07:00
N-Shar-ma 74cdd6148e compose: Fix bug in preview where image at the end would be misaligned.
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.
2024-05-09 10:48:02 -07:00
Aman Agrawal 4e87f35c7d typeahead: Use tippy to position typeaheads without a specified parent.
Except for search typeaheads which have a specific parent container,
we position typeaheads using tippy.
2024-05-08 10:05:27 -07:00
Karl Stolley 12984c9cef selected_message: Adjust light-mode border to specification.
This introduces the alpha described by @terpimost in #22059.
2024-05-08 09:59:40 -07:00
Karl Stolley 7baf3e5e4d selected_message: Correctly express outline colors as variables. 2024-05-08 09:59:40 -07:00
Aman Agrawal 6e2d501b71 left_sidebar: Fix underline overlapping with login icon. 2024-05-07 16:52:57 -07:00
Pratik 3b2bf7b2b9 modal_css: Refactor css of header of user profile modal.
This commit enhances the layout of user profile modal header by using
flexbox properties.
2024-05-06 18:14:40 -07:00
Pratik fdbce9d889 profile_modal: Replaces underscore style classes with hyphenated one.
This commit replaces the underscore-style classes of user profile modal
with the hyphenated one.
2024-05-06 18:14:40 -07:00
Anders Kaseorg 34c465e475 portico header: Remove nonsense _full-height-no-scroll code.
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>
2024-05-06 15:02:45 -07:00
Karl Stolley 2f4988c67c left_sidebar: Correct vertical alignment on 'more conversations.' 2024-05-06 09:54:36 -07:00
Karl Stolley fb9acf8911 message_row: Establish clarifying messagebox-includes-sender class. 2024-05-03 12:34:27 -07:00
Karl Stolley 6c5085b827 message_header: Bring over control hover selectors. 2024-05-03 12:34:08 -07:00
Karl Stolley 50c744db48 left_sidebar: Apply grid to 'more conversations' DM row. 2024-05-03 12:21:59 -07:00
Karl Stolley 7e2811d633 message_view_header: Extract styles to own file.
This has the added value of being named in parallel with
web/src/message_view_header.ts
2024-05-03 11:12:55 -07:00
Sahil Batra a37deb9fbc settings: Use settings-field-label class in language widget label.
We now use "settings-field-label" class in the label of language
selection widget instead of "title" class to add the bottom margin.
2024-05-03 09:51:36 -07:00
Sahil Batra 62d2b93079 settings: Remove dropdown-title class.
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.
2024-05-03 09:51:36 -07:00
Sahil Batra 040486776c modals: Add bottom margin to label elements.
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.
2024-05-03 09:51:36 -07:00
Karl Stolley 6f4a58fe71 settings: Place and style .settings-field-label on Profile. 2024-05-03 09:51:36 -07:00
Karl Stolley 10df1c414f settings: Simplify field-hint selector. 2024-05-03 09:51:36 -07:00
Karl Stolley 8512ea124d settings: Add variable for field/hint bottom margin. 2024-05-03 09:51:36 -07:00
Karl Stolley 38f51683a4 settings: Improve settings-profile-user-field-hint class.
This slight transposition makes it read closer to the adjacent
`settings-profile-user-field` class.
2024-05-03 09:51:36 -07:00
N-Shar-ma 1ba3cda229 compose: Refactor recipient area to use grid layout instead of flexbox.
This is a prep commit for moving the narrow to compose recipients button
before the input, and also aids in the overall compose area redesign.
2024-05-02 14:28:04 -07:00
nimishmedatwal d73a5d06c0 compose(typeahead): Remove text color change on hover.
Fixes #29842.
2024-05-02 13:47:47 -07:00
Karl Stolley 165df5f1f6 message_header: Build message_header.css from zulip.css header styles. 2024-05-02 13:38:58 -07:00
Sayam Samal 4394e87ef1 popovers: Move from global popover min-width to per-popover basis.
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.
2024-05-02 13:31:37 -07:00
Karl Stolley 6325ef4896 message_row: Pull message-edit selectors out of .message_row selector. 2024-05-02 13:27:02 -07:00
Karl Stolley b5f3702de0 message_row: Pull .locally-echoed selectors out of .message_row stack. 2024-05-02 13:27:02 -07:00
Karl Stolley c5740f101f message_row: Pull .messagebox-content out of .message_row stack. 2024-05-02 13:27:02 -07:00
Karl Stolley 08c02ada1a message_row: Extract and flatten .messagebox selectors. 2024-05-02 13:27:02 -07:00
Karl Stolley 0b68a1ee42 message_row: Flatten unread_marker selectors. 2024-04-30 17:35:36 -07:00
Karl Stolley 1695b8c240 unread_marker: Handle offset entirely through CSS variables. 2024-04-30 17:35:36 -07:00
N-Shar-ma bfbf4f6f68 compose: Redesign limit indicator to show remaining characters count.
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.
2024-04-30 14:16:10 -07:00
Karl Stolley c5027e6bca message_row: Assign inner .date_row span a class. 2024-04-30 12:42:41 -07:00
Karl Stolley 5ad162496c message_row: Decouple and simplify date_row, sub-message text styles. 2024-04-30 12:42:41 -07:00
Karl Stolley 1b698eed1e message_row: Clean up unnecessary style and comment. 2024-04-30 12:42:41 -07:00
Karl Stolley c3c9d306f1 message_row: Clean up unused style declarations. 2024-04-30 12:42:41 -07:00
Karl Stolley 5851cdcca3 message_row: Pull .date_row out of nested selectors. 2024-04-30 12:42:41 -07:00
Karl Stolley 27ebc761e7 message_row: Place private message styles in sensible area. 2024-04-30 12:42:41 -07:00
Aman Agrawal d79e84726a sidebar_ui: Fix flickering of invite users button when showing sidebar. 2024-04-29 16:54:15 -07:00
N-Shar-ma 7104c06459 css: Make all modal buttons half opaque when disabled, instead of grey.
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.
2024-04-28 10:38:58 -07:00
N-Shar-ma 6ee0825022 css: Make message send / save buttons half opaque 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.
2024-04-28 10:38:58 -07:00
N-Shar-ma 528e7e4a0e css: Redesign exit / close buttons.
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.
2024-04-28 10:38:58 -07:00
N-Shar-ma 09be97c584 message_edit: Show message source in full opacity.
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.
2024-04-28 10:38:58 -07:00
Karl Stolley 10f0d5dce3 info_density: Extend Markdown-aligned space to message content area. 2024-04-26 12:41:46 -07:00
Karl Stolley 4909438f2c info_density: Describe interelement Markdown spacing as CSS vars. 2024-04-26 12:41:46 -07:00
Sayam Samal c3e43586c8 topic_popover: Redesign popover using the "popover-menu" tippy theme. 2024-04-26 10:35:21 -07:00
Sayam Samal de25006c3d stream_popover: Redesign popover using the "popover-menu" tippy theme. 2024-04-26 10:35:21 -07:00
Karl Stolley e16f22c430 info_density: Apply base font-size to message content area. 2024-04-25 16:58:39 -07:00
Karl Stolley d9fedd7450 info_density: Preserve legacy density behind .more-dense-mode. 2024-04-25 16:58:39 -07:00
Karl Stolley 2763be8977 info_density: Correct legacy line height and apply to message box.
This fixes an incorrect value as noted by Anders Kaseorg on #29569.
2024-04-25 16:58:39 -07:00
Aman Agrawal 263d1ae38e demo_request: Add form for user to request a demo.
This sends an email to us after user fills out and sends the form.
2024-04-25 13:09:05 -07:00
Karl Stolley 0ab7233ffa reactions: Flatten selectors for showing reaction button on touchscreens. 2024-04-25 12:45:41 -07:00
Karl Stolley 3c4d1510d5 reactions: Add 5px of bottom space to reactions area with reactions. 2024-04-25 12:45:41 -07:00
Karl Stolley c1c9db4955 reactions: Correctly size reaction-button content.
Matching the `line-height` on + with the height of the smiley icon
ensures proper vertical centering.
2024-04-25 12:45:41 -07:00
Karl Stolley 18b86ab29e reactions: Consolidate icon styles in reaction button. 2024-04-25 12:45:41 -07:00
Karl Stolley 9d45ecdef4 reactions: Remove unnecessary flex on reaction button. 2024-04-25 12:45:41 -07:00
Karl Stolley d939b9aae6 reactions: Reorganize and deduplicate reaction button CSS. 2024-04-25 12:45:41 -07:00
Karl Stolley d1b790cac1 message_row: Add variable for color on sender hover. 2024-04-25 11:57:01 -07:00
Karl Stolley 058ff15ee2 message_row: Relocate and consolidate sender-related selectors. 2024-04-25 11:57:01 -07:00
Karl Stolley 925020801d me_messages: Correct line-height and bottom spacing. 2024-04-25 11:57:01 -07:00
Pratik 07fbbcd142 css: Allow reaction button to be visible in message box.
It enables the reaction button to become visible when clicking on a
message-box in a mobile view.

Fixes #29529.
2024-04-24 17:41:34 -07:00
CIC4DA 4e5ab739d0 group_pill: Change the groups icon to zulip-triple-user-icons.
Fixes: zulip#28756
In this commit, we are changing the icon for group_pill from fontawesome group to triple-users-icon.
2024-04-24 17:37:38 -07:00
CIC4DA d7b9c2c21c typehead_list_item: Change the groups icon to zulip-triple-user-icon.
Fixes: zulip#28756
In this commit, we are changing the icon for groups in typehead from fontawesome-group to triple-user-icon.
2024-04-24 17:37:38 -07:00
CIC4DA ff41a95f5f user_group_info_popover: Add the zulip-triple-user-icon.
Fixes: zulip#28756
In this commit, we are adding a triple-user-icon in front of the group's name in the user_info_group_popover.
2024-04-24 17:37:38 -07:00
CIC4DA 3745e44963 navbar: Change the user list menu (narrow) to user-list.svg.
Fixes: zulip#28756
In this commit, we are changing the user list menu icon(narrow screen) from triple-users to user-list.
2024-04-24 17:37:38 -07:00
Karl Stolley 8f3fc9f209 message_edit: Match textarea padding, line-height to preview area. 2024-04-24 14:38:36 -07:00
Karl Stolley 48b896b752 message_edit: Zero out browser-default top margin.
This prevents a vertical shift when toggling between editing and
previewing a message.
2024-04-24 14:38:36 -07:00
Karl Stolley a94cdd99d2 message_edit: Consolidate textarea styles under .message_edit_content. 2024-04-24 14:38:36 -07:00
Lauryn Menard d7f9f8333e web-stream-settings: Update strings for stream rename channel.
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.
2024-04-24 14:35:04 -07:00
Karl Stolley bb5db2cc4b message_row: Replace sender-line margins with grid-coordinated line height.
This expresses the height of the message row without need of
margical margins.

Extending the correct line-height to timestamps also means that
single-line messages will be the height of their combined content
and padding, and not erroneously held open by an oversize 28px
timestamp line-height.

Those corrections mean, too, that .message-time only needs to have
its line-height declared a single place, regardless of context.
2024-04-22 14:17:39 -07:00
Karl Stolley 3c5adfe440 message_row: Introduce CSS variable for vertical margin. 2024-04-22 14:17:39 -07:00
Karl Stolley 31865db5c9 message_row: Introduce CSS variable for avatar column width. 2024-04-22 14:17:39 -07:00
Karl Stolley 085abf9c35 message_row: Remove unused variable. 2024-04-22 14:17:39 -07:00
Adnan Shabbir Husain 9aa6bbcee0
modal: Fix invite link overflow in mobile view.
Added a flex div into the copy invite link dialog box.

Fixes #29524.
2024-04-22 10:48:31 -07:00
Karl Stolley 68ea6704a4 widgets: Unify spacing beneath widgets and spoilers. 2024-04-22 10:33:47 -07:00
Karl Stolley a3476af97c markdown: Move all inter-element spacing to bottom. 2024-04-22 10:33:47 -07:00
Karl Stolley fc8e16f5e4 markdown: Set 5px for bottom margin on p, blockquote.
This establishes the same 5px bottom margin on all Markdown
elements, which will aid in converting such values to variables
as part of the information-density project.
2024-04-22 10:33:47 -07:00
Karl Stolley 6e32ce9084 markdown: Clarify and reorder margin and padding on KaTeX. 2024-04-22 10:33:47 -07:00
Karl Stolley 282d900bea markdown: Remove unnecessary inheritance declarations. 2024-04-22 10:33:47 -07:00
Karl Stolley f97cecdfe2 markdown: Remove inapplicable margin-top values.
Because paragraphs have a 3px bottom margin, the 2px top margin
on ordered and unordered lists would collapse into it, for 3px
of space total. So setting 0 on these special selectors has no
effect.
2024-04-22 10:33:47 -07:00
tnmkr bc8e6a86b5 stream_settings: Add new "Stream details" section in General tab.
We want to make it easier to find stream details such as creator,
creation date and stream id. The commit replaces the "Email address"
section in General tab of stream overlay with a new section called
"Stream details", "Email address" is now a field in this section.

If the stream does not have a creator, we only show the stream creation
date in creation details.

Fixes: #25648.
2024-04-20 19:03:43 -07:00
tnmkr c31016cac3 user_display_only_pill: Improve partial structure and css.
This is a prep commit to add a .pill-label wrapper around .pill-value
and other flair text. This extra flexbox structure will help us
vertically align this pill with surrounding text when adopting it to be
used inline.

We also introduce a new class to target this pill. The intention is that
this will more descriptive than contextually styling .pill-container.
2024-04-20 19:03:43 -07:00
tnmkr d934da7afe stream_settings: Remove custom styling from "Generate email" button.
This is so that it better matches existing buttons in this overlay. For
example the "Reset to default notifications" button in Personal tab.

This is a prep commit.
2024-04-20 19:03:43 -07:00
sujal shah 16db1df416 templates: Use 'panel_user_list' as classname.
The term 'subscriber' might be misleading as it doesn't accurately
reflect the purpose of the list, which simply contains all users
within the organization. To enhance clarity and maintain consistency,
I've replaced the classname 'panel_subscriber_member_list'
with 'panel_user_list'.
2024-04-20 16:59:45 -07:00
Karl Stolley 1878f920a8 katex: Properly align timestamps with KaTeX-only messages. 2024-04-17 12:46:30 -07:00
nimishmedatwal 561cc9eab3 user_profile: Add focus to subscribe button.
Also reduces the number of focusable elements between the "streams"
heading and the stream picker.

Fixes #26690.

Co-authored-by: Tim Abbott <tabbott@zulip.com>
2024-04-17 11:52:57 -07:00
N-Shar-ma 352e2ebc5a todo_widget: Move the `add-task-bar` from above to below the task list.
When users needed to add a new task in the todo widget, they would type
it in the field at the top, but the task would be appended to the list,
showing up at the very bottom, which can seem unintuitive.

Now the `add-task-bar` is at the bottom of the list, so that when a new
task is added, it'll appear right where it was typed. The task field
would then shift lower.
2024-04-13 21:56:33 -07:00
N-Shar-ma 6df3ad251a todo_widget: Allow task list title to be set and edited by author.
Users can now name task lists by providing the task list title in the
`/todo` command on the same line. Example: `/todo School Work`. If no
title is provided by the user, "Task list" (which is also the
placeholder) is used as default.

The author of a task list can later edit / update the task list title
in the todo widget, just like the question in the poll widget.

Fixes part of #20213.
2024-04-13 21:56:33 -07:00
Aman Agrawal 42c5a04804 hello: Apply same link styles to all the screen descriptions. 2024-04-13 21:32:50 -07:00
Karl Stolley e43384bd90 markdown: Modernize presentation of spoiler headers. 2024-04-12 17:39:36 -07:00
PieterCK 9b107e3ce1 integrations: Fix styling of unordered lists inside ordered lists.
This change allows different types of lists to
be rendered properly inside the {{start_tabs}} /
{{end_tabs}} block in markdown.

Fixes zulip#29669

Suggested-by: Lauryn Menard <github:laurynmm>
2024-04-12 13:30:33 -07:00
Kislay Verma 505d66afeb user_invite: Convert invite modal to tabbed format.
This commit converts the radio buttons (for
selecting email/link) to tab
components in the user invite modal.

The selected tab is in focus by default and arrow keys
can be used to toggle the selected tab.

Appropriate tooltips are shown when a tab is disabled.

Fixes #29392.
2024-04-12 08:23:00 -07:00
Jose Corte b41a116d42 onboarding: Fix formatting of registration page buttons.
This ensures that in the registration page the text does not overlap icons in any language.

Fixes #20563.
2024-04-12 08:15:24 -07:00
Aman Agrawal 402f589e76 user_topic_popover: Keep reference visible when popover is open.
In recent view and inbox view, we keep the topic visibility icon
visible when the topic visibility popover is visible.
2024-04-12 08:13:40 -07:00
Aman Agrawal 9a8ebf3a34 recent_view: Only normal show topic visibility indicator on focus.
This is now similar to how they behave in inbox view.
2024-04-12 08:13:40 -07:00
Sayam Samal 7744c8b264 actions_popover: Fix content overflowing when the max-width is defined.
The simplebar core documentation, recommends to not style the element
initalising the simplebar at all and use an inner element instead.

Following the recommendation, we move the max-width property from the
popover tippy options, to the `.simplebar-content` element via the
`--popover-menu-max-width` custom property.

While doing so, we also simplify the max-width to `350px`, since the
responsiveness for smaller screen is already been taked care of in the
shared popover styling.

This prevents the issue where the content overflows and gets hidden
instead of wrapping, when the width of the popover reaches the set
max width (if any).
2024-04-11 15:57:24 -07:00
Sayam Samal f9ec17e78e popovers: Fix styling for multi-line menu options. 2024-04-11 15:57:24 -07:00
Sayam Samal 678a3eccab popovers: Fix width discrepancies in popover menus.
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.
2024-04-11 15:57:24 -07:00
Sayam Samal ba64900373 popovers: Simplify popover menu top and bottom padding. 2024-04-11 15:57:24 -07:00
Sayam Samal 4105a38c1f popovers: Add minimum width to popover hotkey hints. 2024-04-11 15:57:24 -07:00
Sayam Samal dcb6252e57 popovers: Update popover hotkey hint colors. 2024-04-11 15:57:24 -07:00
Sayam Samal 19077fa1f6 actions_popover: Update icons for message actions menu options. 2024-04-11 15:57:24 -07:00
Sayam Samal 299aa7c39f popovers: Add hotkey hints support via a new handlebar template. 2024-04-11 15:57:24 -07:00
Sayam Samal 4b0e6ae3d8 actions_popover: Use the new "popover-menu" theme.
Fixes part of #28699.
2024-04-11 15:57:24 -07:00
Sayam Samal 422230e82d popovers: Add consistent tippy arrows which support all placements.
Added `tippy.js/dist/border.css` along with some custom CSS override,
to add arrows which inherit the border color and width of the popover,
while also supporting all placements.

Also consolidates the CSS styling of the popovers to the `tippy-box`
element, which is the recommended way to theme the element according to
https://atomiks.github.io/tippyjs/v6/themes/#creating-a-theme.
This further helps in unifying the styling of the popover and the arrow,
and prevents inconsistencies such as shadow of the popover being casted
onto the arrows.
2024-04-11 15:57:24 -07:00
Sayam Samal 6bf9c2bdfc popovers: Rename "navbar-dropdown-menu" theme to "popover-menu" theme.
Also renames the navbar dropdown related CSS terms, to their equivalent
popover related terms to accompany the name change of the theme.
2024-04-11 15:57:24 -07:00
Karl Stolley 7291f0a919 info_density: Set font size, line height vars in dev. 2024-04-11 10:25:03 -07:00
Shubham Padia 3f6ceba39a settings_users: Add role filter to user list.
Fixes #18617.
- The role filter is added to both active and deactivated user
list. The original plan was to introduce a multi select checkbox
dropdown for the roles, but since that component is not ready yet,
we will use the dropdown component for the first iteration.
- To accomodate multiple filters, we have used an approach
similar to the one in recent_view_ui.js where we use dropdown
callback function and on("input") event on text search to set the
filter value in memory. The predicate functions uses these filters.
- We have also changed the default message when there are no
users to show to reflect `filters` instead of `current filter`.
2024-04-10 13:45:06 -07:00
Mahhheshh 68646cacfc message_edit_history: Add loading spinner.
Adds a loading spinner to the message history overlay,
improving the user experience by providing visual feedback while the
message edit history is loading.
2024-04-10 13:10:12 -07:00
Mahhheshh 619f85fac7 message_edit_history: Set cursor to default on hover. 2024-04-10 11:25:31 -07:00
N-Shar-ma 7072794871 css: Make pills' content collapse according to width available.
We set `min-width: 0` on all nested flex containers for pills, not just
the pills label, which allows the label content to collapse as much as
needed with ellipsis when overflowing.

Fixes: #27205.
2024-04-05 09:14:37 -07:00
Karl Stolley 6d5243148a timestamps: Calculate the maximum timestamp width in use.
Fixes: #26970
2024-04-03 17:38:43 -07:00
Karl Stolley 82d0eec0bc timestamps: Consolidate and simplify message-time properties.
This is better form, and also sets things up to render sample
timestamps for calculating their max width.
2024-04-03 17:38:43 -07:00
Karl Stolley 09d7105747 timestamps: Consolidate variable-based timestamp width. 2024-04-03 17:38:43 -07:00
Karl Stolley 1425d2f71f message_body: Hyphenate message-time class. 2024-04-03 17:38:43 -07:00
Karl Stolley c25975642a message_body: Remove status-time references.
The `.status-time` class was used only for setting a `top` value,
but that's made moot by the use of grid in the message area.
2024-04-03 17:38:43 -07:00
Lauryn Menard 6f8d23b759 portico-styles: Updates some CSS rules used in the integrations docs.
Removes the extra side margin on tip, warning and keyboard tips when
they are in ordered lists.

Removes the extra bottom margin for h3 elements in the integrations
docs.

Removes the unordered list style for the integrations docs.
2024-04-02 09:30:48 -07:00
Afonso Azaruja e217d35ccd link_preview: Fix extraneous shadow.
Fix extraneous shadow at bottom of link preview
in stream messages in dark theme, in private
messages for both themes and in mentions, group
mentions and direct mentions.

This is done by applying the same color, used
in the background, to the shadow. There are CSS
variables that hold the values of the background
color.

Fixes #28853.
2024-04-01 13:06:42 -07:00
Aman Agrawal d21f5c9b75 registration: Ask user how they found Zulip. 2024-04-01 12:44:12 -07:00
Aman Agrawal 293992fe60 portico: Enable tippy tooltips for all portico pages with common style. 2024-04-01 12:44:12 -07:00
sujal fbcf31c9e0 bot-url: Add event filtering UI to generate bot URL modal.
Adds an option to the generate bot URL modal to filter for events
that will trigger notifications. This option is conditionally
displayed when only `all_event_types` is defined for the selected
integration.

If selected, the URL will display all events by default. There
are "check all" and "uncheck all" buttons to easily include or
remove all the events from the URL.

Fixes #27628.
2024-04-01 11:39:03 -07:00
N-Shar-ma 6f7e030eb2 compose: Increase gap between Draft button's text and the counter. 2024-04-01 13:31:15 -05:00