Commit Graph

241 Commits

Author SHA1 Message Date
Sahil Batra
6f6059da73 personal_menu: Support changing information density settings.
This commit adds UI in personal popover menu for user to change
font-size and line-height.

Fixes part of #33186.
2025-03-10 16:07:37 -07:00
Aman Agrawal
f57a3abd83 recent_view: Make icon change on hover for visibility indicator robust.
Using character index for changing icon is not reliable, so
we use `background-image` to change the icon being displayed here.
2025-03-05 21:58:15 -08:00
Sayam Samal
4c9d47c390 inline_topic_edit: Disable save button and show tooltip on empty topic.
This commit disables the save button when the topic name is considered
as empty as part of the `realm_mandatory_topics` being set to True.

Since disabled elements do not fire events, it is not possible to
trigger tippy tooltips on disabled elements – such as the Save button
in the inline topic edit UI. Thus this commit adds a tooltip to the
disabled save button by wrapping/unwrapping it inside a `span` wrapper
pragmatically via the `ui_util.disable_element_and_add_tooltip` and
`ui_util.enable_element_and_remove_tooltip` helper methods.
2025-02-26 17:26:35 -08:00
Sayam Samal
2723adac54 inline_topic_edit: Improve design of inline topic edit UI.
This commit improves the design of the inline topic edit UI by making
the following changes:
- Increases the dimensions of the text input element.
- Fixes the font scaling inside text input element.
- Replaces the old save and cancel buttons with the new icon buttons.

Fixes #33155.
2025-02-26 17:26:35 -08:00
Sayam Samal
5ed85e0a2d buttons: Fix focus ring on tab for action and icon only buttons.
This commit fixes the bug where the focus ring was not visible while
tabbing through the buttons due to values being overridden. This also
fixes the outline offset for the banner close button to make it visible.
2025-01-30 10:17:39 -08:00
sanchi-t
9921b116e8 css: Refactor theme colors for settings.
This change moves the light and dark theme colors for
`settings` to CSS variables.
2025-01-28 17:55:00 -08:00
Sayam Samal
c8de1debf8 stream_color: Remove spectrum-colorpicker library.
As a follow-up to the previous commit which replaces the spectrum color
picker instances with the custom color picker popover, this commit
removes the spectrum-colorpicker library and its related code from the
codebase.
2025-01-07 17:27:58 -08:00
Karl Stolley
f8cbff51e0 compose: Control formatting dividers with CSS. 2024-12-17 11:05:44 -08:00
sanchi-t
4134cfe2bf css: Remove non-existent selector. 2024-12-17 10:28:32 -08:00
sanchi-t
92b8d66c3b css: Refactor theme colors for #recent_view.
This change moves the light and dark theme colors for
`#recent_view` element to CSS variables.
2024-12-17 10:28:32 -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
Shubham Padia
0575db3ab6 css: Use --color-active-row-modal for settings overlay active rows.
This fixes a bug introduced in f40e1e9ad0
We changed the settings overlay container background color in that
commit, from hsl(0deg 0% 98%) to #ededed. #ededed is same as
hsl(0deg 0% 93%). The latter is the exact same color for stream and
group row active background. While we changed the settings overlay
background color, we did not change the active row color for stream and
group rows.
Fixes https://chat.zulip.org/#narrow/channel/9-issues/topic/Lack.20of.20highlighting.20of.20selected.20group.2E/near/1993630
2024-12-05 10:36:34 -08:00
Sayam Samal
35ba96bd9d recent_view: Remove bootstrap classes from recent view buttons.
This commit removes the final vestiges of `bootstrap-btn-default` class
from the codebase, by moving the relevant styles from the
`bootstrap-btn` and `bootstrap-btn-default` classes to the
`button-recent-filters` class.
2024-11-20 11:08:58 -08:00
Sayam Samal
650076b027 recent_view: Rename btn -> button in CSS classes.
This commit is a part of the efforts to rename btn-related classes
and variables to align with Zulip's no-abbreviations policy and
streamline the search results.
2024-11-14 12:03:36 -08:00
opmkumar
523dc7e2be invite-user-modal: Add general class names for improved extensibility.
Adds general class names in invite_user_modal.hbs for custom time
the input and unit so that these elements more easily be extended
for use in other modals with a user specified custom time.

Updates the listener in invite.ts that was using the removed
"custom-expiration-time" class to instead use the id for the
input and unit div, "custom-invite-expiration-time".

Corresponding updates have been made to the relevant CSS files to
ensure consistent styling and future scalability.

Co-authored-by: Ujjawal Modi <umodi2003@gmail.com>
Co-authored-by: Lauryn Menard <lauryn@zulip.com>
2024-11-01 09:55:05 -07:00
Karl Stolley
9231c97454 compose: Bring colors into variablized concord. 2024-10-30 11:23:22 -07:00
Karl Stolley
8c90c9d68d modals: Set new background, border colors. 2024-10-25 15:39:13 -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
sanchi-t
9b5accdb43 css: Refactor theme color for kbd. 2024-10-24 11:09:39 -07:00
Karl Stolley
6a4fd180fa left_sidebar: Simplify consistent opacity for muted channels, topics. 2024-10-15 15:04:47 -07:00
Karl Stolley
155fc9f1d7 link_styles: Establish variable-based generic link styles. 2024-10-15 15:04:47 -07:00
Karl Stolley
78826dd981 left_sidebar: Remove styles interfering with redesigned colors. 2024-10-15 15:04:47 -07:00
evykassirer
83dc7fc4d9 typeahead: Prevent blue styling from mouse hover on typeahead item. 2024-10-08 17:36:40 -07:00
Vector73
66113365a5 saved_snippets: Add new feature for saved snippets.
Fixes #31227.
2024-10-01 11:48:15 -07:00
sanchi-t
84f9765b18 css: Remove non-existent class selctor. 2024-10-01 10:24:16 -07:00
sanchi-t
0f506eaf91 css: Refactor theme colors for kbd.
This change moves the light and dark theme colors for `kbd` to
CSS variables.
2024-10-01 10:24:16 -07:00
sanchi-t
19ba94b946 css: Refactor theme colors for app_components.
This change moves the light and dark theme colors for
`app_components` to CSS variables.
2024-10-01 09:41:22 -07:00
sanchi-t
a8e809e63f css: Refactor theme colors for .table-striped.
This change moves the light and dark theme colors for
`.table-striped` to CSS variables.
2024-10-01 09:40:47 -07:00
sanchi-t
72971cda8e css: Refactor theme colors for .demo-organization-warning.
This change moves the light and dark theme colors for
`.demo-organization-warning` to CSS variables.
2024-10-01 09:40:47 -07:00
Karl Stolley
1d4f282cbd sidebars: Present neutral and active sidebar-row states. 2024-09-30 13:38:33 -07:00
sanchi-t
82fd3c9b32 css: Refactor theme colors for alerts.
This change moves the light and dark theme colors for
`alerts` to CSS variables.
2024-09-27 13:27:58 -07:00
Karl Stolley
89e32bc917 left_sidebar: Place redesigned subheaders. 2024-09-24 11:08:50 -07:00
Karl Stolley
61221ddc74 sidebars: Update colors, opacity for side bar titles and toggles. 2024-09-24 11:08:50 -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 <umodi2003@gmail.com>
2024-09-23 18:09:38 -07:00
sanchi-t
07af9b357b css: Refactor theme colors for .message_edit_history_content.
This change moves the light and dark theme colors for
`.message_edit_history_content` to CSS variables.
2024-09-23 16:07:51 -07:00
Sayam Samal
19c29af4bb icons: Cleanup redundant .fa-group related styling.
This also fixes the opacity of the `.zulip-icon-triple-users` icon in
the recent view.
2024-09-20 09:07:05 -07:00
Karl Stolley
d73044ee57 compose: Decouple compose buttons from button classes.
In the 2024 redesigned button configurations, the compose buttons
become outliers. This retains their previous style inherited from
.button, allowing that base component class to move forward.
2024-09-19 16:16:11 -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
Karl Stolley
8c984f68ec checkboxes: Decouple label.checkbox from .new-style tangle. 2024-09-11 14:22:45 -07:00
Karl Stolley
df3d3197ff buttons: Simplify color declarations attached to .button. 2024-09-11 14:22:45 -07:00
Karl Stolley
7cb55d2f91 buttons: Remove unused .btn-link styles. 2024-09-11 14:22:45 -07:00
Karl Stolley
7674318332 settings: Move tab-switcher out of .new-style block. 2024-09-11 14:22:45 -07:00
Sanchit Sharma
48b60db4a4 settings_config: Use kbd for realm_enter_send label.
Fixes: #29083.
2024-09-06 11:47:04 -07:00
Sanchit Sharma
671946351c settings: Improve visibility of "Enter Sends Message" setting.
Addresses user research feedback by duplicating the "Enter Sends
Message" setting in the Settings > Preferences menu, specifically within
the General section, ensuring users can easily locate and configure
this option.

server_events_dispatch: Remove break statement.
The settings page needs to be updated when
`enter_sends` property is updated.

css: Update vertical-align to middle for the checkbox element.

Co-authored-by: Akarsh Jain<akarsh.jain.790@gmail.com>.
2024-09-06 11:47:04 -07:00
Shubham Padia
2f120d2572 settings: Make show more tab look similar to other tabs.
Fixes https://chat.zulip.org/#narrow/stream/101-design/topic/org.20settings.20-.20show.20more.20-.20icon.20alignment/near/1935512
Also renames `.collapse-settings-btn` to `.collapse-settings-button`.
2024-09-03 12:20:42 -07:00
Shubham Padia
3afc34050b css: Use classnames for settings page .sidebar li items.
Having the `*` selector there affects the performance. See
https://chat.zulip.org/#narrow/stream/6-frontend/topic/CSS.20selector.20performance/near/1845719
for more details.
We've used `sidebar` instead of `sidebar-wrapper` for the rules in
dark-theme also, since that is the rule being followed for light theme.
We've introduced a new class called `sidebar-item`.
2024-08-30 10:23:19 -07:00
Karl Stolley
f55feae0ea search: Reset default iOS button styles. 2024-08-16 13:58:50 -07:00
Tim Abbott
e4567e05ac css: Explode dark theme disabled rule.
This replaces a :disabled selector with individual ones for each
element type; I verified in CSS selector profiling that this change
removes lines that were previously about 10% of profiled CSS selector
processing time for rendering the combined feed.

The reason being that the rendered elements have very few disable-able
elements, but the browser was spending a lot of time trying to match
**every** element for whether it might have been disabled, which was
slow.

This probably reflects a browser bug.
2024-08-14 13:42:59 -07:00
Shubham Padia
a746a7e784 css: Remove unnecessary rule for subscriptions_overlay.
Even though the border-color was set for `#subscriptions_overlay
.subsection-parent div`, since the border-style was not set. It did not
have any effect on the appearance of the children div of
.subsection-parent.
2024-08-13 22:36:35 -07:00
Shubham Padia
0d95d79033 css: Use classname instead of div for .flex.overlay-content.
Each child div for .flex.overlay-content has the class
.overlay-container, so it is safe to replace the div with that
classname.
Having the `div` selector there affects the performance. See
https://chat.zulip.org/#narrow/stream/6-frontend/topic/CSS.20selector.20performance/near/1845719
for more details.
2024-08-13 22:36:35 -07:00