Commit Graph

52 Commits

Author SHA1 Message Date
Karl Stolley be4d4085f2 emoji: Display status emoji as flexbox in settings.
This does not adjust any of the padding from a float-based era.
It's entirely possible that the status-preview area especially
deserves some further tuning.
2023-09-21 17:18:47 -07:00
Karl Stolley 55e43b6926 settings: Display radio choice label as flexbox. 2023-09-21 17:18:47 -07:00
Zixuan James Li d3e4456562 linkifiers: Use only the handle for dragging.
So that the user can still select and copy text from the body of the
linkifier rows. It might be helpful if we extend this behavior to other
draggable rows, like those for custom profile fields settings.

Fixes #26798
2023-09-21 15:27:16 -07:00
Satyam Bansal 9cde3abd4d bot-settings: Add modal to generate Integration URL.
Fixes part of #25976.
2023-09-20 17:49:51 -07:00
palashb01 e1322faae0 user_profile: Fix the gap between labels and input.
This commit increases the gap between the labels and input/select
of the user profile manage user/bot tab for clearer visibility.
It also reduces the gap between the 'deactivate user' button and
the last input to make it look better.
2023-09-11 10:39:00 -07:00
Ujjawal Modi 9a96d19315 invites: Frontend changes for adding the new realm setting.
This commit does the changes in frontend required
for adding the new setting `Who can create multiuse invite link.`

Fixes #15159.
2023-09-07 14:21:01 -07:00
Lauryn Menard 19b8217e49 demo-orgs: Disable changing user's email visibility until email set.
Because demo organization owners do not initially have an email
set, some of the personal and organization settings in the web-app
UI should be disabled/hidden until the owner configures an email
address for their account.

Disables the dropdown for changing the user's email address visibility
in the account & security tab of the personal settings overlay until
the user configures an email address.
2023-08-31 15:02:16 -07:00
Lauryn Menard 665deac7c0 demo-orgs: Disable show/change API key if email not configured.
Because demo organization owners do not initially have an email
set, some of the personal and organization settings in the web-app
UI should be disabled/hidden until the owner configures an email
address for their account.

Disables the show/change API key button in the account & security
tab of the personal settings overlay if the user's email address
is not configured. A tooltip is shown when hovering over the disabled
button explaining why the feature is disabled.
2023-08-31 15:02:16 -07:00
Karl Stolley 2e07c03968 settings: Align notification play button in a flex layout.
This allows the select to flex, keeping the buttons position on
screen even at mobile-scale viewports.

While other most other controls are currently not so responsive,
this might provide some direction (along with a TODO) on how to
go about moving controls in that direction.

Fixes: #26563
2023-08-31 12:06:32 -07:00
Sahil Batra 75126c96a4 settings: Make custom profile fields table similar to other tables.
This commit updates the admin custom profile fields table to be
similar to other tables in settings page. After this change,
the table will be horizontally scrollable for narrow screens
and the buttons in actions column will not wrap to multiple lines.

This increases the width of "Actions" column and it takes some
unnecessary space, but this will be handled in the next commit
which will adjust "Actions" column in all the tables.
2023-08-21 15:00:39 -07:00
Sahil Batra 154f4f16b5 css: Remove unnecessary CSS defined using table-condensed class.
This commit removes unnecessary CSS defined for tables using
table-condensed class.

The vertical-align property for "td" elements is not needed
since by default the vertical-align property for "td" elements
is inherited and is set to "middle".

The margin properties set for the tables in informational
overlay is also not needed since we have set the width
to 100% and setting the margin to auto does not result in
anything different.
2023-08-21 15:00:39 -07:00
Zixuan James Li 5301060954 linkifiers: Support dragging and reordering linkifiers.
This also removes sorting on the pattern and the URL template, because
it does not make sense anymore as we make linkifiers draggable.

Fixes #23716
2023-08-14 15:21:48 -07:00
Zixuan James Li 31b7003d61 settings: Rename movable-profile-field-row.
So that we can reuse it for other movable rows in places like
.admin_linkifiers_table.
2023-08-14 15:21:48 -07:00
Lauryn Menard 225be0bb97 dropdown-list-widget: Remove dropdown-list-body class and reference.
Removes the "dropdown-list-body" class and references as it is no
longer used in the new DropdownWidget. The previous uses of the
class were removed in commit 875d564f2d.
2023-08-11 12:26:47 -07:00
Sahil Batra db3b9e4742 settings: Make custom profile fields table consistent with others.
We change the custom profile fields table to have same header as
of other table and as a result this also makes the page look
better if an organization has zero custom profile fields.
2023-08-06 18:13:33 -07:00
Aman Agrawal 6efcb7a349 dropdown_widget: Refactor to use Class. 2023-07-27 14:10:08 -07:00
Zixuan James Li 000761ac0c realm_playgrounds: Replace url_prefix with url_template.
Dropping support for url_prefix for RealmPlayground, the server now uses
url_template instead only for playground creation, retrieval and audit
logging upon removal.

This does the necessary handling so that url_template is expanded with
the extracted code.

Fixes #25723.

Signed-off-by: Zixuan James Li <p359101898@gmail.com>
2023-07-24 17:40:59 -07:00
Anders Kaseorg 1b72d5c413 styles: Remove Firefox override for dropdown appearance.
The default appearance in modern Firefox is totally fine, and our
override was incorrectly changing the dropdown triangle to black for
the dark theme.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-07-24 13:10:03 -07:00
Anders Kaseorg 7746e11486 dependencies: Upgrade JavaScript dependencies.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-07-21 15:58:42 -07:00
Sahil Batra f5208a7db6 settings: Re-add bootstrap CSS to custom time limit inputs.
This commit re-adds bootstrap CSS for custom time limit inputs
used by various settings by using more specific selector in
settings.css.

This is a prep commit for removing bootstrap CSS for text type
inputs.
2023-07-07 10:10:28 -07:00
Sahil Batra 96014c1123 settings: Re-add bootstrap CSS rules to ".settings_text_input" selector.
This commit re-adds bootstrap CSS rules to ".settings_text_input"
selector in settings.css and this helps in adding the bootstrap
CSS to text inputs used in settings.

This is a prep commit to remove bootstrap CSS for text type inputs.
2023-07-07 10:10:28 -07:00
Sahil Batra 8c3421c7f4 settings: Remove unnecessary CSS.
There is no text type input element inside
"#service_name_list" element.
2023-07-07 10:10:28 -07:00
Aman Agrawal 503f4b9bfd css: Use 200 font weight for dropdown chevron-down icon.
`font-weight: lighter` converts here to `100` which converts 200
since that is what we support.
2023-07-06 17:57:37 -07:00
Aman Agrawal 1557c4d112 css: Use 400 font weight instead of 500.
500 font weight defaults to 400 which is what we support.
2023-07-06 17:57:37 -07:00
Ganesh Pawar fff9b334ff default_streams: Convert inline form to modal.
Fixes #20838.
2023-07-06 16:24:44 -07:00
Sahil Batra db825ad202 settings: Remove settings_text_input class from url type inputs.
This commit removes settings_text_input class from url type inputs
and we instead add the width property to settings_url_input.

Note that we might instead have a single class for all type of inputs
instead of having different classes for url, password and text type
inputs in further commits.
2023-06-23 11:53:38 -07:00
Sahil Batra a860e717bb bootstrap: Remove bootstrap CSS for url type inputs.
We use url type inputs in the add and edit custom field modals
and also to show the url type custom fields in "Profile" panel
and "Manage user" modal.

This commit re-adds the bootstrap CSS rules to these specific
input elements using modal_url_input and settings_url_input
class and thus removes the CSS for url type inputs from
bootstrap.css.

We might replace the new class added here with a common class
for all type of inputs in further commits.
2023-06-23 11:53:38 -07:00
Tim Abbott ac3acc941f css: Increase opacity for grey elements.
The message timestamp and a few settings elements looked off with the
new 25% off white dark theme font color.
2023-05-16 16:52:22 -07:00
Lakshay Mittal a208da9c4d style: Fix dropdown text alignment by reducing vertical padding.
Zulip's select widgets have a 30px height; this comes from Bootstrap
but is also generally nice for visual consistency.

In modals, we use a 15px font-size, instead of the 14px used in the
rest of the app, and in that context, the 4px vertical padding plus
30px fixed height resulted in the text not being vertically aligned.

Fix this by removing that vertical padding; all of our select elements
with these classes appear to position the text in the center of the
dropdown through other CSS mechanisms.
2023-05-16 15:43:06 -07:00
Sahil Batra e4420bcd61 dropdown_list_widget: Show stream icons when widget is disabled.
We show the stream privacy icon for the selected option in
dropdown list widget even if the widget is disabled. It is
fixed by changing the CSS to hide only the "i" element used
for the arrow toggle button and not all the "i" elements in
disabled state.
2023-04-26 15:44:35 -07:00
Prakhar Pratyush c526543498 settings: Update the 'Muted topics' setting.
This commit updates the existing 'Muted topics'
settings UI to add support for other visibility
policies.

Changes:
Settings sidebar:
1. Rename 'Muted topics' to 'Topics'.
2. Change icon.
Main panel:
3. Rename 'Muted topics' header to 'Topic settings'.
Topics table:
4. Rename 'Date muted' to 'Date updated'.
5. Update the search bar placeholder text to 'Filter topics'.
6. Drop the 'Actions' column.
7. Add a status column with a dropdown set of options.
(Muted, Unmuted, Default for stream)

Fixes #25081.
2023-04-25 12:46:05 -07:00
Prakhar Pratyush b366c37452 user_topics: Rename and refactor 'muted_topic_ui_row.hbs'.
This prep commit renames 'muted_topic_ui_row.hbs'
to 'user_topic_ui_row.hbs'.

This includes minor refactoring, as it is now the
template for rows with any visibility_policy,
not just MUTED.
2023-04-19 16:58:40 -07:00
Sahil Batra 3853a8bf20 dropdown_list_widget: Do not underline the option text on focus.
We remove the underline on the text in the options on focus as
we already have a outline which is enough to show that the option
is focussed.
2023-04-19 16:54:13 -07:00
Zixuan James Li 05a3456581 settings: Use url_template for internal names.
This replaces any "url_format_string" or "url_format" with
"url_template" for the linkifier settings, including HTML ids, template
variables, and etc.

This is not affected by any external API changes.

Signed-off-by: Zixuan James Li <p359101898@gmail.com>
2023-04-19 12:20:49 -07:00
sayamsamal 9f6f77f6bc icons: Change bot icon from GitHub logo to Google material icon.
We currently use the GitHub logo to show the bots settings in both
personal and organization settings. This icon is not a correct
representation since we use have support for several different bots
including but not limited to a GitHub integration bot.

This commit replaces the GitHub logo with Smart Toy material icon
from Google, while also adding the required licencing details at
docs/THIRDPARTY.

Part of #19797.
2023-04-13 10:47:09 -07:00
Sahil Batra c37bd3cbd9 settings: Increase width of textarea field in profile settings.
This increases width of textarea field in profile settings to
match it with other inputs.
2023-04-03 16:59:51 -07:00
Sahil Batra 9612125481 settings: Increase width of person picker in profile settings.
This commit increases width of person picker element in profile
settings to match the width of other inputs.
2023-04-03 16:59:51 -07:00
Sahil Batra 16f8a83c32 settings: Increase width of text inputs.
This commit increases width of text inputs in settings, stream
settings and user group settings to be 325px, which is the
minimum width of select elements on these pages.
2023-04-03 16:59:51 -07:00
Sahil Batra e1877ce57e settings: Add settings_text_input class to text inputs.
This commit adds settings_text_input class to text inputs in
settings, stream settings and user group settings pages. This
class is used to set the width of inputs to 206px, as we will
be removing the boostrap rule which sets width of the input
in further commits.
2023-03-27 22:34:30 -07:00
Sahil Batra dcce524376 settings: Increase width of url field in edit custom field form.
This commit increases the width of url field, displayed for
custom external account type fields, in edit profile field
form. The width of the input is increased as urls are generally
long enough and did not fit in the width set previously in most
cases. We increase the width to match the width in add custom
profile field form.
2023-03-27 22:34:30 -07:00
Sahil Singh 89733670fd image_upload_widget: Refactor style of upload_widget's preview_image.
Forms using upload widget were using the
same css for image preview.

We fix this by assigning a class to the
widget and applying specific styles to it.
2023-03-27 10:19:29 -07:00
Palash Baderia cefc191dd6 settings: Fix responsiveness in change email,password dialogs.
Added a width for the Change Email and Password dialogs at
sm_min (576px) and ml_min (425px) to make them more responsive
on narrow screens.

Fixes: #24339.
2023-03-27 10:11:22 -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 <anders@zulip.com>
2023-03-24 17:26:55 -07:00
Anders Kaseorg 5cdf38b1f7 styles: Use standard CSS nesting syntax.
CSS nesting is being standardized with the syntactic restriction that
the nested selector cannot start with an identifier.  This was
necessary to allow the syntax to be parsed without lookahead.

https://webkit.org/blog/13813/try-css-nesting-today-in-safari-technology-preview/
https://www.w3.org/TR/css-nesting-1/#syntax

The postcss-nesting plugin used by postcss-preset-env enforces this
restriction.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-03-20 11:26:30 -07:00
Sahil Singh 37a0c9c1b9 settings: Fix alignment of loading message.
The loading message that appears at the
top of the page when loading the Bots/
Uploaded Files/Users/Deactivated Users
page under Settings appears to be misaligned.

We fix this by changing the height of the
loading-spinner to match the line-height
of loading text.
2023-03-14 13:23:48 -07:00
Sahil Batra bd9d1b9158 dropdown_list_widget: Set dropdown menu wide enough to fit options.
We now set the width of dropdown menu opened for dropdown-list-widget
elements such that it is enough for all the options. For smaller
screens the dropdown menus are wide since the settings panel and
modal content can be scrolled horizontally.
This change is done only for dropdown-list-widget elements in
"Organization settings" panel and in bot-owner widget in bot edit
modal.

We don't do this change for move topic modal now as it cannot be
scrolled horizontally and appears beneath the button due to position
property.
2023-03-14 12:53:41 -07:00
Sahil Batra 7d9fe8fd23 settings: Set width of dropdown toggle same as select elements.
This commit sets width of toggle buttons for dropdown list
widget elements same as select elements in both organization
settings. We set the min-width to be 325px and max-width to
100%.
2023-03-14 12:53:41 -07:00
Sahil Batra 0beac2f221 settings: Make settings page horizontally scrollable.
We make settings page horizontally scrollable such that
the user can see the complete dropdown by scrolling in
case the dropdown is wider than the screen.
2023-03-14 12:53:41 -07:00
Sahil Batra 80bd425133 settings: Set width of select elements in settings page.
This commit sets width of select elements in settings page
to "auto" such that the width adjusts as required in different
languages and we also keep minimum width of 325px to maintain
consistency of width across elements in the page to not look
ugly.

We also remove the CSS for overriding width of various role
based select elements and a couple of others which was added
to adjust the widths for different languages. Since we have
now set the width to auto, the browser will automatically
adjust width to fit the options.
2023-03-14 12:53:41 -07:00
Palash Baderia c1009bc051 settings: Drop column from tables on narrow screen.
Drop the "last_active" column in the users section of the
organization settings, and the "Bot_type" column in the bots
section on sm_min (576px or less). Also, drop the "Date_muted"
column in the muted topics section of the personal settings
on ml_min (425px or less).

Added new className "topic_date_muted" for the date_muted
column, and "bot_type" for the bot_type column, to hide them
using display none when the viewport is small.

Fixes: #24320
2023-03-01 15:42:15 -08:00