Commit Graph

44 Commits

Author SHA1 Message Date
Aman Agrawal
a393d9d495 user_group: Use double user icon instead of tripe user icon. 2025-03-14 11:07:33 -07:00
evykassirer
e13f59a13a input_pill: Don't wrap words mid-word unless they're wider than input. 2025-03-05 10:21:52 -08:00
evykassirer
844febd511 input_pill: Scale user group pill icon with font size. 2025-03-04 17:53:12 -08:00
Sahil Batra
118eaffd3a groups: Update how we show members count in group pills.
Instead of showing count as "N users", we just show the
count in parentheses now.

Fixes #33628.
2025-03-03 10:38:10 -08:00
Maneesh Shukla
a98135649f deactivated_user: Show deactivated status for deactivated users.
Fixes: #26833.
2025-02-18 22:20:05 -08:00
evykassirer
bc4ee9a4d0 input_pill: Scale close button with app font-size. 2025-02-05 12:33:50 -08:00
Vishesh Singh
37e0dff013 compose_pill: Show bot icon after bot name.
Show the bot icon after the name on compose pill if it
is a bot.
Align the bot to the center.

fixes part of #28561.
2025-01-09 11:58:20 -08:00
Shubham Padia
f147e4dd4a
Group invalid inputs (#32647)
* css: Extract invalid input outline and shadow colors to variables.

We will use these colors in future for input pills and it would be
convenient to have them in a variable.

* group_setting_pill: Show outline on invalid input.

We could have manipulate the class directly from user_group_pill. But
it felt better to have `show_outline_on_invalid_input` as a param for
the input_pill prototype since we can have a consistent error state for
other pill input boxes if we want to.

* input_pill: Widget should not show as pending after pill creation.

* group_settings: Disable save changes button if pill widget is pending.

This will disable the button for group, realm and stream group settings.

* user_group_create: Don't go to next step with pending group widget.

We just show the red outline and shaking animation as an indication that
a group widget setting is pending when the user tries to go to the add
members step.

* stream_create: Don't go to next step with pending group widget.

Fixes #32113.
We just show the red outline and shaking animation as an indication that
a group widget setting is pending when the user tries to go to the add
subscribers step.
2024-12-10 16:57:48 -08:00
sujal shah
771d3b1434 invites: Enable adding users to user groups during invitations.
This commit allows users to be assigned to custom groups when
inviting them to join Zulip, similar to how channels are handled.
The implementation follows a similar pattern for adding pills,
ensuring consistency, as user groups and channels are parallel
in nature.

Fixes #24365.
2024-11-26 11:26:34 -08:00
Karl Stolley
9231c97454 compose: Bring colors into variablized concord. 2024-10-30 11:23:22 -07:00
sanchi-t
aa48a0e3ee css: Refactor theme colors for input_pill.
This change moves the light and dark theme colors for
`input_pill` to CSS variables.
2024-10-24 11:09:39 -07:00
Sahil Batra
89d0ad1d60 user_group_edit: Add support to update subgroups of existing groups. 2024-10-22 10:23:36 -07:00
tnmkr
23efb5cec7 custom_profile_fields: Support non editable profile fields.
This commit allows configuration of "editable_by_user" property from the
organization settings modal. It also adds support for non-editable
fields in profile settings modal.

Fixes #22883.

Co-Authored-By: Ujjawal Modi <[email protected]>
2024-09-23 18:09:38 -07:00
sujal shah
3b69f2e5d9 stream_settings: Extract creator_detail section.
Extract display_pill and date code to separate
'creator_detail.hbs' file.
Rename 'stream_creator_details' to 'creator_details'.
2024-09-13 18:44:58 -07:00
Sahil Batra
d73fac481b stream-settings: Set max-width for stream creator pill.
We now set max-width on the pill value for stream creator pill
to make sure that the pill does not get too long for long names
and the full name can anyways be seen by clicking on the pill.
2024-07-18 12:34:53 -07:00
Sanchit Sharma
65635ab948 invite: Increase clickable area to display typeahead menu.
Previously, the .input area was small, restricting the activation
of the typeahead menu to a small region.
2024-07-17 12:15:45 -07:00
Karl Stolley
f738a68bb1 pills: Make --height-input-pill authoritative. 2024-07-17 10:31:01 -07:00
Sahil Batra
f937669ba1 user_pill: Show deactivated icon in user_display_only_pill.
This commit adds code to show the deactivated icon for
deactivated users.
2024-07-16 14:52:17 -07:00
adnan-td
6f4d14ddde stream_pill: Add channel privacy icons in input_pill.
Modify stream pills to add channel privacy decorations inside
input pills for areas eg: the UI for adding members to a channel.

Partly fixes: #25257.
2024-07-12 15:00:02 -07:00
evykassirer
7cb00d171e search pills: Prevent overflow for very long pills. 2024-07-10 17:44:04 -07:00
Karl Stolley
5cd4a8c8e5 pills: Express pill-container spacing on base class. 2024-06-23 22:00:18 -07:00
Karl Stolley
780391fd43 pills: Better express pill-container outer spacing. 2024-06-23 22:00:18 -07:00
sanchi-t
2d79ce2e93 invite: Replace stream checkboxes list with stream pills.
Introduce an input field with typeahead functionality, initially
populated with the default streams for the organization.

Fixes #26871.
2024-06-22 20:04:28 -07:00
Karl Stolley
3a4719915c compose: Let pill-container dictate spacing of pills.
The 2px and 6px values expressed as variables here are taken from
@terpimost's mocks in Figma.
2024-06-21 14:46:44 -07:00
Karl Stolley
0844e2cba9 pills: Size pill components and inputs in ems. 2024-06-21 14:46:44 -07:00
evykassirer
f6c9b515c7 input_pill: Redesign input pills.
This commit also replaces the close button with
an svg. This is part of the app redesign, and
preparation for the upcoming search pill project.
2024-06-20 15:16:17 -07:00
evykassirer
84cf7f8677 input pill: Remove pill-container-btn class in favor of search styling.
This style is currently only used for search suggestions. Soon,
styling for those suggestions will become more specific, and so
for now we'll keep those styles in search.css to be more clear
about what the new styles affect. If we want to repeat something
like this in the future somewhere else in the app, we can come
up with a generic styling then once we have a better idea of
what that will look like.
2024-06-20 15:16:17 -07:00
adnan-td
ef65137675 compose_pills: Fix long text overflow in DM recipient box.
Removes the fixed height of the input field in compose
DM recipient box. This commit makes the behaviour of recipient
compose box equal to input pills used else where.

Fixes: #27688.
2024-06-11 12:00:15 -07:00
adnan-td
2521adb0cd invite_user_modal: Fix background color of input field. 2024-06-11 11:59:40 -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 <[email protected]>.
2024-05-17 10:47:22 -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
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
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
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
adnan-td
87dee7a9b2 invite_user_modal: Replaced email text_area with input_pill.
This makes the widget considerably more attractive, and probably a bit
more usable.

Fixes #29391.
2024-03-29 11:13:03 -07:00
sujal
29ca4ba662 stream_settings: Convert name to pills.
Convert anchor tag to pills containing an image/avatar
and username within both existing and new stream
subscriber member lists and group member lists
using the new user_display_only_pill.hbs template.
If user has long username that breaks the UI,
overflow is handled with ellipsis.
add a context class (panel_subscriber_member_list)
to add 'padding 5px'to 'pill_value' for stream
subscriber member list and group member list.

To retrieve  an avatar of a user add a
'img_src: people.small_avatar_url_for_person(user/person)'
field in 'stream_editsubscriber.js', 'user_group_edit_members.js',
'stream_create_subscribers.js' and 'user_group_create_members.js'.

Fixes: #25724.
2024-03-08 17:33:14 -08:00
Karl Stolley
b147440c43 emoji: Display status emoji as flexboxes in pills. 2023-09-21 17:18:47 -07:00
Sahil Batra
5a6a8a63e1 group_settings: Fix placeholder in pill input for members.
This commit fixes placeholder text in the pill input for user
group members UI in "#groups" overlay to mention members instead
of subscribers. For this we add a new template instead of using
add_subscribers_form.hbs and thus this commit also updates
the class names used in javascript code accordingly.
2023-09-20 15:40:11 -07:00
evykassirer
e026aa1217 UI redesign: Change background color.
Fixes: #21750
2023-05-09 16:25:28 -07:00
evykassirer
18312be6db compose: Add ability to switch to PM in stream dropdown.
Fixes #3409
2023-04-27 17:04:19 -07:00
SameepAher
9e4b5b2bed css: Fix text overflow bug for pill values.
This commit fixes the text overflow bug for pill values by adding a
maximum width of 100% for the pill along with the ellipsis property on
text overflow.

Fixes: #21807.
2023-04-24 16:04:03 -07:00
Anders Kaseorg
d274583d8f styles: Use modern color notation.
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 <[email protected]>
2023-03-24 17:26:55 -07:00
Anders Kaseorg
c1675913a2 web: Move web app to ‘web’ directory.
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 <[email protected]>
2023-02-23 16:04:17 -08:00