Commit Graph

199 Commits

Author SHA1 Message Date
Prakhar Pratyush
087abb4314 composebox: Show 'Enter a topic (skip for general chat)' placeholder.
Use a more instructive placeholder instead of "Topic" when
topic is not mandatory in a realm.

Updated placeholder:
'Enter a topic (skip for general chat)'.
2025-02-26 14:03:24 -08:00
Karl Stolley
562bfd5671 compose: Handle topic-box focus and blur. 2025-02-26 13:59:03 -08:00
Karl Stolley
1bc53831c7 compose: Conditionally render placeholder for general chat. 2025-02-26 13:59:02 -08:00
Karl Stolley
81b6879464 compose: Match topic input text color to channel. 2025-02-26 13:59:02 -08:00
evykassirer
37cf88bb87 compose: Scale send button with font size. 2025-02-24 22:33:05 -08:00
Aman Agrawal
290ecba48c compose: Fix topic input box not visible for long stream names.
Since we want the width of the stream name to change responsively,
we need to use either media breakpoints or `vw` to ensure
that the stream name and topic name are visible at all widths.
2025-02-24 21:55:13 -08:00
Apoorva Pendse
b547dcd643 compose_banner: Flash only once for exceeded length.
https://chat.zulip.org/#narrow/channel/101-design/topic/invalid.20message.20border.20flashing/near/2094736
2025-02-23 23:11:18 -08:00
apoorvapendse
4b82e08b13 compose: Disable send button with a default cursor.
This commit is a pre commit to a change that will
introduce banners and tooltips as per various
unmet conditions while composing a message.

To accomodate future changes, the toggling is
switched to conditional addition/removal of the
`disabled-message-send-controls` class while
updating the status of the send button.

Also a default cursor is added and the send
area tooltips are disabled whenever the
`disabled-message-send-controls` class is
present.
2025-02-23 23:11:18 -08:00
evykassirer
c9109ef736 compose: Use em for message-limit-indicator font size. 2025-02-20 11:14:49 -08:00
evykassirer
3fccbdd369 saved snippets: Use em for width, font-size, padding. 2025-02-20 10:06:55 -08:00
Anders Kaseorg
3ead4c06f0 app_variables: Rename “color” variables that are actually gradients.
Signed-off-by: Anders Kaseorg <[email protected]>
2025-02-19 11:01:48 -08:00
evykassirer
2eccb8b46e compose: Remove stale classname: compose_draft_button.
This was removed in 609106e2d0
but the CSS was still there, unused.
2025-02-18 21:55:45 -08:00
evykassirer
f72dbad5e6 compose: Fix em calculation errors.
Followup to  #33523.
2025-02-18 14:53:23 -08:00
evykassirer
c76a246a8a compose: Use em for sizing and position of stream typeahead icon. 2025-02-18 12:13:24 -08:00
evykassirer
fc3c755e1d compose: Scale close button with font size. 2025-02-14 16:39:48 -08:00
evykassirer
4482d0a009 compose: Use grid for enter sends choices to align radio buttons. 2025-02-04 10:43:51 -08:00
Vector73
32d131ab5a saved_snippet: Move "Create a new saved snippet" button to the bottom.
Renames "Add a new saved snippet" to "Create a new saved snippet" and
"Add saved snippet" tooltip to "Insert saved snippet".

Moves "Create a new saved snippet" button to the bottom sticky area of the
dropdown.
2025-01-30 09:46:32 -08:00
Karl Stolley
7111d429e6 compose: Size help-button icon to match other formatting buttons.
Because button sizes are precisely specified in the area, we set
the buttons as flex items that neither to grow or shrink, which
is essential to right-size the button area for the help button.
2025-01-24 14:57:29 -08:00
Harsh
f9617c0aff searchbox_css: Replace display: none with visibility: hidden.
This commit standardizes the use of visibility: hidden for
clear_search_buttons in search boxes.
2025-01-21 10:31:34 -08:00
Karl Stolley
ea3cd18382 compose: Hide scrolling buttons with keyboard focus. 2025-01-14 15:52:02 -08:00
Karl Stolley
c6bdebec03 compose: Add logic for scrolling buttons. 2025-01-14 15:52:02 -08:00
Karl Stolley
8feaa5e6e8 compose: Initialize scrolling buttons only when needed. 2025-01-14 15:52:02 -08:00
Karl Stolley
a5e234f8ff compose: Size help button to match all others. 2025-01-14 15:52:02 -08:00
Karl Stolley
0d0aaa8586 compose: Introduce scrolling buttons in gridded layout. 2025-01-14 15:52:02 -08:00
Karl Stolley
cf29edaa65 compose: Flatten a popover-free formatting bar. 2025-01-14 15:52:02 -08:00
whilstsomebody
f1dd8d88c9 compose: Add background and border colors for message limit.
Added colors to notify users when the message length is near
the limit or has exceeded it. Used distinct colors for each
case to provide clear feedback.

Fixes: #32171.
2025-01-07 17:57:15 -08:00
whilstsomebody
569b07477b compose: Rename over_limit to textarea-over-limit.
According to the current naming convention, underscores are used
instead of hypens in class names, and this is more globally unique for
its meaning.
2025-01-07 17:49:31 -08:00
evykassirer
9fcc41d85c compose: Scale compose banner close button with info density setting. 2025-01-07 12:52:12 -08:00
evykassirer
ae805763bc compose: Use an icon for the mac command hotkey hint. 2025-01-06 11:29:38 -08:00
Karl Stolley
e4cba81c90 app_variables: Match dark theme popover to menu. 2024-12-17 11:05:44 -08:00
Karl Stolley
f8cbff51e0 compose: Control formatting dividers with CSS. 2024-12-17 11:05:44 -08:00
Karl Stolley
b56c838688 compose: Constrain icons to square boxes. 2024-12-17 11:05:44 -08:00
Karl Stolley
c16d434c26 compose: Correct typo in em-unit conversion. 2024-12-17 11:05:44 -08:00
Karl Stolley
eed844caef
compose: Maintain circular shape for conversation arrow. 2024-12-13 09:48:41 -08:00
evykassirer
23551c7774 compose: Use em for enter send setting font size. 2024-12-12 17:51:01 -08:00
evykassirer
90c06b34c6 compose: Size stream message arrow icon with em. 2024-12-12 09:13:04 -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
opmkumar
5eb51e2df6 message_edit: Add message length limit indicator in edit message UI.
Adds a message length limit indicator similar to the one in the compose box.
The tooltip message for the disabled save button now appears dynamically
based on whether the message exceeds the length limit or the editing time
has expired.

Fixes #25271.
2024-12-04 11:44:51 -08:00
opmkumar
0055633002 css: Add general class names for improved extensibility.
Adds general class names in `compose.hbs` so that these elements can be
more easily expanded for use in the edit message UI as well. These
classes will be used in the `check_overflow_text` function of
`compose_validate.ts`, allowing this function to handle both the edit
message UI and compose box UI.
2024-12-04 11:44:51 -08:00
opmkumar
f2e30f4354 css: Refactor border colors for .new_message_textarea.over_limit.
This change moves the border color for `.new_message_textarea.over_limit`
to CSS variables.
2024-12-04 11:44:51 -08:00
Sayam Samal
c0caeab198 compose: Rename disable-btn class.
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
Karl Stolley
4038832889 unread_count: Set class for legacy quiet counters. 2024-11-07 14:56:38 -08:00
Karl Stolley
16b8c7562a compose: Update colors for draft popover. 2024-11-04 15:31:12 -08:00
Karl Stolley
0cab8df681 compose: Extend 4px border-radius to topic box.
All similar elements in the compose box--the channel/DM widget, the
pill container on DMs, and the compose textarea--all use a 4px
border-radius, correcting the topic box's outlier status.
2024-10-30 11:23:22 -07:00
Karl Stolley
17561d09a1 compose: Give tab-focused widget wrapper sensible border. 2024-10-30 11:23:22 -07:00
Karl Stolley
9231c97454 compose: Bring colors into variablized concord. 2024-10-30 11:23:22 -07:00
Anders Kaseorg
2671a5c32c stylelint: Enable stylelint-high-performance-animation.
Signed-off-by: Anders Kaseorg <[email protected]>
2024-10-23 14:56:39 -07:00
Anders Kaseorg
f023fa6fc0 styles: Be specific about which properties are transitioned.
Signed-off-by: Anders Kaseorg <[email protected]>
2024-10-23 14:56:39 -07:00
Shubham Padia
6968d7374a compose: Change cursor to default instead of not-allowed.
Fixes #31214.
2024-10-04 11:40:15 -07:00
Sayam Samal
0a9ae964fe send_later_popover: Improve on-focus styling of enter send choices.
Previously, no custom styling was being applied to the enter send
choice options, which led to uneven styling from the other popover
options, as well as the outline ring being cut-off from the edges of
the popover. This commit fixes these issues by adding custom styling
for the outline ring when the enter send choice options are focused.
2024-10-02 14:35:37 -07:00