Commit Graph

971 Commits

Author SHA1 Message Date
Karl Stolley 42e0d72b67 compose_box: Maintain consistent dropdown height.
This commit keeps the height of the dropdown consistent, even when
it's adjacent a multiline collection of pills in a group DM.

It also keeps the righthand buttons and narrows top-aligned, too.

Additional markup and CSS ensures that the < marker always stays
vertically centered with respect to the dropdown.
2023-05-25 17:19:29 -07:00
Karl Stolley 4df04f1032 compose_box: Correct topic input-box height.
While this commit achieves what the subject advertises (fixing the
input box's height to match the recipient drop-down), but it does
so by relying heavily on flexbox's behavior to manage the height
of the elements and vertical centering, where necessary, rather
than positioning hacks or vertical padding.

This commit also removes some additional styles that do not make
sense (e.g., `min-width: 0`) or that need not be set.
2023-05-25 17:19:29 -07:00
Satyam Bansal 856329bb45 message_formatting: Reorder items to prioritize more useful ones.
Fixes #25743.
2023-05-25 12:01:36 -07:00
Satyam Bansal 07a6a85cf8 message_formatting: Remove line from emoji formatting tip. 2023-05-24 16:47:52 -07:00
Satyam Bansal 0e1b0939f5 message_formatting: Add a row for "---" in message formatting tips. 2023-05-24 16:47:52 -07:00
Daniil Fadeev dc81858829 popovers: Export `tippy_no_propagation` function and rename it.
This commit will enable us to use the API we developed for Tippy
popovers, allowing us to integrate them into any external modules
that require a Tippy popover.
2023-05-24 16:24:09 -07:00
Aman Agrawal 54fae321aa tooltips: Fix offscreen tooltips taking scroll space. 2023-05-24 15:43:19 -07:00
Aman Agrawal 95f8b3a618 hashchange: Disable scroll position restoration.
This avoids a bug where during a browser initiated hashchange
(via back/forward/manually typed URL) browser sets the scroll
position of the current hash based on its memory of the scroll
position of the new hash.
2023-05-24 15:43:19 -07:00
Aman Agrawal 77f2562cbb popovers: Use `fixed` position for all bootstrap popovers.
`absolute` position elements in message feed can go
offscreen since `html` is now scrollable.
2023-05-24 15:43:19 -07:00
Aman Agrawal 26c63abe18 overlays: Don't scroll background when modal/overlay is open. 2023-05-24 15:43:19 -07:00
Aman Agrawal dc04b0e171 navbar_alerts: Adjust app based on navbar height. 2023-05-24 15:43:19 -07:00
Aman Agrawal a78dc4a2bd css: Scroll on `html` instead of `.app`. 2023-05-24 15:43:19 -07:00
Daniil Fadeev 3e2d5b3c86 compose_validate: Use correct stream_id value for different context.
This commit addresses the issue of relying on `compose_state` for
retrieving the `stream_id` to display warning banners. Previously,
warnings were shown for syntax in the message edit box based on
whether that syntax would trigger a warning for the draft content (if
any) currently in the compose box.

We fix this by using a new `get_stream_id_for_textarea` function to
obtain the correct `stream_id` value for the check being done.

Fixes: #25410.
2023-05-24 12:48:44 -07:00
Daniil Fadeev 807b9ae081 compose_validate: Extract the logic of getting stream_id. 2023-05-24 12:48:44 -07:00
Hardik Dharmani 72e628ffdf edit_bot: Include current bot owner to bot owner dropdown. 2023-05-24 12:11:52 -07:00
Satyam Bansal d221cb92c6 stream_settings: Remove unused parameters after migration to tippy. 2023-05-24 12:11:10 -07:00
Satyam Bansal 920a5eac1a stream_settings: Migrate popovers to tippy.
Fixes #25627.
2023-05-24 12:11:10 -07:00
Satyam Bansal 094c3da965 stream_settings: Fix disabled subscribe button tooltip.
Previously, hovering over the disabled subscribe button
would not display any tooltip due to an undefined object
being passed to the function that created the tooltip.
2023-05-24 12:11:10 -07:00
sbansal1999 7c68a30363 billing-helpers: Add commas to formatted amount. 2023-05-24 11:32:24 -07:00
Aman Agrawal 263ee4cb86 feedback_widget: Don't use non-optimal animation properties.
Animating `box-shadow` and `top` is slow since the browser
drops frames when animating them. We can fix it by using `will-change`
property but it is just better to not animate them and instead
use transform.
2023-05-24 11:30:55 -07:00
Anders Kaseorg a3d6c47b7d internal_url: Remove obsolete TODO comment.
zulip-mobile currently requires Android ≥ 7 and iOS ≥ 14, both of
which support replaceAll.  The code change was in commit
54f90e41c0 (#25554).

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-05-24 11:26:56 -07:00
evykassirer 47c107faa5 modals: Fix background color bug from background color changes. 2023-05-23 21:40:11 -07:00
Satyam Bansal b3196e5310 settings: Close date-picker when settings modal is closed.
Previously, if the user closes the settings modal by pressing
the "Esc" key and if any date-pickers were open then they would
remain on the screen. This commit fixes that and now date-pickers
are closed when the settings modal is closed.

Also added a puppeteer test to verify the said behavior.

Fixes part of #25097.
2023-05-23 17:01:00 -07:00
Satyam Bansal 557d80965c flatpickr: Add close_all function to close all the opened date pickers. 2023-05-23 17:01:00 -07:00
evykassirer c486588360 search: Make search box bottom border visible again.
The nav bar's bottom border was being hidden by the search
bar. This makes the search bar slightly less high to fix this
issue.

Soon this code will be replaced with the changes in #24345.
2023-05-23 14:46:44 -07:00
Karl Stolley 903090c582 css: Move mention-pill colors under rendered markdown.
This just ensures that the mention-pill color selectors are children
of `rendered_markdown`, which class appears both in the message-
preview area as well as individual message rows.

Fixes #25720.
2023-05-23 12:57:24 -07:00
evykassirer 9427fb7230 settings: Fix narrow-screen background color, use color variable.
Fixes #25708.
2023-05-23 11:31:03 -07:00
Sahil Batra 295b37bceb bootstrap: Remove bootstrap CSS rules for number type inputs.
We have added the required CSS rules to individual elements in
previous commits and this commit can remove the CSS in bootstrap.css.
2023-05-23 10:54:12 -07:00
Sahil Batra c8ad693e41 billing: Add bootstrap CSS to number type inputs.
This commit adds bootstrap CSS rules for number type inputs
in billing and upgrade page to billing.css as we will be
removing them from bootstrap.css in further commits.
2023-05-23 10:54:12 -07:00
Sahil Batra 96eaadda71 activity: Add bootstrap CSS styles for number type inputs.
This commit adds bootstrap CSS rules for number type inputs
in activity page to activity.css as we will be removing them
from bootstrap.css in further commits.
2023-05-23 10:54:12 -07:00
Sahil Batra a62a863f67 bootstrap: Remove CSS for "submit" type inputs.
We use "submit" type inputs in dev login page. Only "cursor"
CSS was applied to those elements from bootstrap and this
commit adds it to those elements in portico_signin.css and
removes the CSS in bootstrap.css and bootstrap-btn.css.
2023-05-23 10:54:12 -07:00
Sahil Batra 599ad856b2 bootstrap: Remove CSS for ".input-xxlarge" elements.
We use "input-xxlarge" class for search box in activity
support page only. This commit adds the width property
in activity.css for the search box and rest of the CSS
applied using this class was redundant and can be removed
safely.
2023-05-23 10:54:12 -07:00
Sahil Batra f7b27e6fea bootstrap: Remove CSS for ".input-large".
We use "input-large" class only for sponsorship page
and the bootstrap CSS for this class is already
overridden by CSS defined in portico.css.
2023-05-23 10:54:12 -07:00
Sahil Batra 8719594c51 bootstrap: Remove CSS for search type inputs.
We do not use search type inputs anywhere in the app
and thus we can safely remove the CSS for it.
2023-05-23 10:54:12 -07:00
Sahil Batra d8c8de5f27 bootstrap: Remove CSS for color type input elements.
We do not use "color" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 3f57672e15 bootstrap: Remove CSS for "tel" type input elements.
We do not use "tel" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 385d30b285 bootstrap: Remove CSS for week type input elements.
We do not use "week" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 33df97a3d9 bootstrap: Remove CSS for time type input elements.
We do not use "time" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 7627f346a3 bootstrap: Remove CSS for month type input elements.
We do not use "month" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 5d484a8794 bootstrap: Remove CSS for date type input elements.
We do not use "date" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 8ca8745c0e bootstrap: Remove CSS for datetime type input elements.
We do not use "datetime" type input elements anywhere in the
app.
2023-05-23 10:54:12 -07:00
Sahil Batra 286f47468d bootstrap: Remove CSS for button type inputs.
We do not use button type inputs anywhere in the app so
we can remove its CSS.
2023-05-23 10:54:12 -07:00
Sahil Batra b08ba862e6 bootstrap: Remove CSS for reset type inputs.
We do not use "reset" type inputs in our app, so we can
safely remove the CSS for them.
2023-05-23 10:54:12 -07:00
Aman Agrawal dc6099d656 message_row: Use equal top/bottom padding in message content.
We had the `3px 0 1px` padding before migration to use grid,
then I switched it to use `4px 0 1px` since we were planning to
use blue box border which seemed to have helped that case.

Since we switched to using outline for blue box, it makes sense
to just use equal padding.
2023-05-23 10:45:28 -07:00
Karl Stolley ab94bcb21b css: Move recipient-row unread markers to message row file. 2023-05-22 15:54:57 -07:00
Karl Stolley 36c5df7663 css: Move message-row styles to own file. 2023-05-22 15:54:57 -07:00
Karl Stolley ffbd0cb316 css: Clean up comments for future readers. 2023-05-22 15:54:57 -07:00
xoldyckk 6f009c5e65 ts: Convert rtl.js to TypeScript.
Co-authored-by: Satyam Bansal <sbansal1999@gmail.com>
2023-05-22 15:41:42 -07:00
Karl Stolley 9f99235368 send_button: Suppress Send tooltip on tabbing to send. 2023-05-22 13:01:52 -07:00
Aman Agrawal eeea5c1713 css: Fix @everyone and @stream displayed as user mentions.
Backend incorrectly renders @everyone and @stream as `user-mention`
while they are clearly `group_mention`. To fix this, we use
`data-user-id` property of @everyone and @stream which are
set to `*` for them.
2023-05-22 12:41:44 -07:00
Aman Agrawal 67ff421194 css: Change mention text and background colors. 2023-05-22 12:41:44 -07:00
Aman Agrawal c415944e55 css: Separate mention pill colors. 2023-05-22 12:41:44 -07:00
Lalit 888d6d8037 settings_playground: Fix sorting issues in playgrounds table.
Removed the sorting functions which were sorting under the assumption that
our comparison items were a list instead I used the generic sort functions
functionality of our `list_widget` module.
2023-05-22 09:36:24 -07:00
Aman Agrawal f04ae8acd3 drafts: Fix message header overlapping outline. 2023-05-22 09:31:21 -07:00
Lalit 7346ce98f3 ts: Convert `emojisets` to TypeScript.
Declared types for '*.png' modules and '!style-loader?*' modules in
`assets.d.ts` and used them in `emojisets.ts`.
2023-05-22 09:02:42 -07:00
Hardik Dharmani d9716bc189 left_sidebar: Improve mentions in muted topics.
When there are only muted unread mentions in a stream, show `@` icon
and unread count in faded style, also align the `@` on more topics
with no unead counter on it.

If there are only muted unread messages without mentions don't show
the unread counter on the stream.

Fixes #25382.
2023-05-19 18:40:57 -07:00
Hardik Dharmani 8c6f9b3f95 unread: Improve live update for direct mentions in muted topics.
The "Mark as unread" event handler was not passing through the
mentioned_me_directly value, which is now important to left sidebar
rendering.

See the extended comment for how this solution is incorrect/incomplete
and has to fall back to guessing a potentially incorrect value in rare
situations.

Co-authored-by: Tim Abbott <tabbott@zulip.com>
2023-05-19 18:00:25 -07:00
Lalit 7ac891a6b9 people: Add `version` parameter for medium sized avatar urls.
We need to append the `version` parameter when constructing the urls for
medium-sized images so that the browser updates the image in real time when
the user uploads a new avatar.

Fixes #25558.
2023-05-19 13:52:00 -07:00
Akarsh Jain 12db83b011 help: Open Help Center links in new tab for empty message lists.
This commit updates the Help Center links in all relevant empty message
list views to open in a new tab by default. This prevents users from being
navigated away from the app.

Fixes #25337.
2023-05-19 13:51:00 -07:00
Karl Stolley c2f6167c01 css: Remove superfluous grid- properties.
The use of named areas with `grid-area` make it unnecessary to
declare `grid-row` or `grid-column` values. (Note also that
grid areas must not be presented in quotation marks.)

Additionally, because `.unread_marker` is no longer placed on the
grid by itself (i.e., it always accompanies `.date_unread_marker`
or `.message_unread_marker`), it does not need any manual grid
placement, `grid-area` or otherwise.
2023-05-19 13:48:16 -07:00
Aman Agrawal 9aa9f9b3c8 message: Separate unread marker of date_row from message.
This allows us to easily disable unread marker for date row of
the first unread message without producing any bugs.
2023-05-19 13:48:16 -07:00
Karl Stolley ef3289b73b css: Present message_row as CSS Grid.
This change enables the unread marker to participate as a grid item,
rather than the product of various absolute/relative positioning
hacks. The intention is to therefore prevent the blue active-message
box from disappearing on browsers that have zoomed out (~80% zoom).

With grid in place, this also makes for a more robust presentation
of each message row, and named grid areas should make it possible to
modify and extend the grid into the future.

Finally, this change removes styles that are no longer necessary in
the context of CSS Grid.
2023-05-19 13:48:16 -07:00
Tim Abbott 9c09edd7af ui_init: Fix loading spectators view.
18578cc5da broke the success code path.
2023-05-19 13:42:48 -07:00
Josiah Kievit 28c5c64b8d
css: Remove copy code button outline.
Added styling to show no outline around the copy to clipboard button on click. 

Previously, when clicking this button, a rectangular outline appeared around 
the button, which didn't look good, since a 'Copied!' message was already displayed.

Fixes #25533.
2023-05-19 13:09:10 -07:00
evykassirer 27bc36b7d6 settings: Revert dark mode background color changes. 2023-05-19 10:57:50 -07:00
Sahil Batra a4db19f9aa signup: Fix selector used for validating the forms.
This commit fixes a typo in the selector used to
validate registration, support, realm creation,
password reset and terms of service forms. This
typo also resulted in a bug where "This field is
required" error message was shown at incorrect
position and this change fixes it.

This commit also fixes the client side error
handling of these forms which did not work
perfectly due to the selector being wrong.
2023-05-19 10:48:52 -07:00
Alex Vandiver 18578cc5da ui_init: Properly call reject with an error, not an xhr.
If the spectator registration call fails, properly log the error and
call `reject` with an error object, not the xhr that `channel.post`
calls its error callback with.

This does nothing to address the UI question of what to do should this
request fail.
2023-05-19 10:48:21 -07:00
Karl Stolley 0407abc788 help_pages: Improve anchor highlights.
These changes ensure that only headings targeted by URL fragments are
highlighted in full. Div elements will have their immediate first
child element highlighted instead (e.g., the first element of an API
parameter box).
2023-05-18 13:57:42 -07:00
Aman Agrawal 44ae67d426 css: Fix gap between header and sticky header at some zoom level. 2023-05-18 13:39:46 -07:00
Aman Agrawal 3acd7b8f47 css: Move message header padding to the element with border.
Apply border and top margin on the same element so that browser
has no way to introduce a gap between them.
2023-05-18 13:39:46 -07:00
Lalit a2db6df826 ts: Convert `deprecated_feature_notice` module to TypeScript. 2023-05-18 08:52:26 -07:00
Lalit 0216eb8915 deprecated_feature_notice: Use `zod` for validating data when fetching it from `localstorage`.
Refactored `maybe_show_deprecation_notice` to use zod to parse the `shown_deprecation_notices`
array stored in localstorage for better type-safety.
2023-05-18 08:52:26 -07:00
Lalit 656a31d38d refactor: Move `maybe_get_stream_name` from `stream_data` to `sub_store`.
This commit moves `maybe_get_stream_name` function from `stream_data` to `sub_store`
as it didn't had any dependency on `stream_data` and it also helps us to cut off
dependency on `stream_data` for some of the modules including `user_topics`.
2023-05-18 08:46:16 -07:00
Lalit a3f46957bc ts: Convert `confirm_dialog` module to TypeScript. 2023-05-18 08:44:30 -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
Trident Pancake 6fb16f3598 message_edit: Disable save btn after edit time limit
Fixes #25413.

The old code was disabling the save button wrong by using
`.addClass("disabled")` instead of `prop()`.

Added tooltip for the disabled save button as per issue #25413 and changed
"Times up!" color to red.

The textbox readonly logic was changed to no longer becoming readonly. Reason
being there are edge cases involving the compose buttons such that simply
marking the textbox as readonly is not sufficient.

E.g. using the compose buttons after readonly still modifies the content.

One solution might be to just hide the compose buttons visually. However, there
are edge cases for that too. If preview mode was previously active, then
perhaps that state needs to be reverted. If any modal is open, such as the emoji
picker, then that needs to be closed. Solving these edge cases doesn't
improve the user experience. Keeping the textbox editable allows an easier way
for user to copy the text and don't have weird cases.
2023-05-16 15:59:29 -07:00
Trident Pancake b1c801847b message_edit: Remove redundant is_editable check 2023-05-16 15:59:29 -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
Alex Vandiver 4a43856ba7 realm_export: Do not assume null extra_data is special.
Fixes: #20197.
2023-05-16 14:05:01 -07:00
Sahil Batra 007a51f277 accounts: Allow user to change email visibility during first login.
We now allow users to change email address visibility setting
on the "Terms of service" page during first login. This page is
not shown for users creating account using normal registration
process, but is useful for imported users and users created
through API, LDAP, SCIM and management commands.
2023-05-16 13:52:56 -07:00
Daniil Fadeev 859903648b scheduled_messages: Add banner for unscheduled message.
Fixes: #25614.
2023-05-16 12:39:01 -07:00
Mateusz Mandera 632e856240 support: Add option to delete user from /activity/support. 2023-05-16 12:38:12 -07:00
Karl Stolley 386d87635e popovers: Shorten 'Quote or reply' label.
This removes the previous "or forward" text from the message
actions popover, and keeps the documentation in sync with the
new text. Internationalization tests are updated, too.

Fixes #25603.
2023-05-16 12:36:29 -07:00
Aman Agrawal e6c7363613 css: Make top message logo less bright. 2023-05-16 12:35:17 -07:00
Aman Agrawal 29880a4a1e css: Change border-bottom color for message header. 2023-05-16 12:35:17 -07:00
Aman Agrawal c84681c69c css: Color tweaks. 2023-05-16 12:35:17 -07:00
Aman Agrawal 2a98968846 css: Use 75% white as default text color. 2023-05-16 12:35:17 -07:00
Aman Agrawal 3f4deedba1 css: Remove stale css.
`message_view_header_underpadding` is no longer present in the
codebase as we move the padding to be above the sticky recipient
bar.
2023-05-16 12:35:17 -07:00
Aman Agrawal 9f5b7ba9b0 css: Separate out text colors. 2023-05-16 12:35:17 -07:00
Aman Agrawal c96de330b0 stream_color: Dim recipient bar background color. 2023-05-16 12:35:17 -07:00
Aman Agrawal 17bdf22521 css: Allow `actions_hover` icon to have a focus outline. 2023-05-16 11:57:17 -07:00
Brijmohan Siyag 17ec4f1e06 tooltip: Update max-width of disabled send button tooltip.
Changes the tooltip max-width on the disabled send button
from 300px to 350px to remove the weird looking padding at
the end.
2023-05-16 11:24:35 -07:00
Brijmohan Siyag cb00fbc42f compose: Check posting policy for direct messages.
Prior this commit, changing the message type from a stream (where posting
was not allowed) to a direct message using the compose box dropdown, did not
changed the state of the send button from disabled to enabled even though
direct messages were allowed in the organization.

This was happening because `check_stream_posting_policy_for_compose_box` was
only for streams.

Now, function is updated to check for both streams and direct
messages, as it checks if direct messages are allowed or not, and depending on
that, it updates the send button's state, tooltip and displays a relevant banner.
2023-05-16 11:24:35 -07:00
Josh Yap ee88bb5187 popovers: Hide emoji reaction when icon already present.
When hovering over another user's message, the emoji reaction
icon is already present. This commit removes the "Add emoji
reaction" menu item from the popover menu in this case, to
avoid redundancy.

Fixes #25602.
2023-05-16 10:53:54 -07:00
Josh Yap 231888b5a5 popovers: Add keyboard shortcut to emoji reaction menu item.
Fixes #25602.
2023-05-16 10:53:54 -07:00
Tim Abbott 3876171df1 compose: Fix opening compose box when viewing invalid stream.
This likely needs further refactoring to switch to using stream IDs
rather than names in this code path, but this change fixes an
exception that would be throw when opening the compose box while
viewing a narrow to an invalid stream name/ID.
2023-05-16 10:39:33 -07:00
Tim Abbott 74e6367455 css: Increase constrast for blue box. 2023-05-15 16:01:09 -07:00
Joelute 584b11af2d unread_banner: Apply updated design to message feed banners.
In #22524, we have updated the compose banner to the new, updated design
while the unread banners have remained the same. When comparing them side
by side, they look rather old and outdated. We should apply the updated
design to the unread banners as well.

Fixes: #25551.
2023-05-15 15:59:12 -07:00
Joelute d556b73084 unread_banner: Update HTML of unread banners to use zulip icons.
Previously, the close buttons on the unread banners used "x" as the icon.
This unfortunately doesn't scale well as we increase the font-size. To fix
this, we should update the button to use zulip icons instead of a character
as the button.
2023-05-15 15:59:12 -07:00
Karl Stolley b852da6eed help_pages: Preserve anchor highlights.
This commit assigns a `.scroll-target` class to preserve any URL
fragment whose corresponding ID is on the self-same page as the
activating link.

This accommodates a side-effect of the fetch-based page-loading
logic, which seems to lose the `:target` reference once a load
or reload is complete.
2023-05-15 14:57:42 -07:00