Commit Graph

86 Commits

Author SHA1 Message Date
Aman Agrawal 8654f839b5 overlays: Stop document from occupying the extra scrollbar width.
When overlay / modal is displayed, scrollbar is hidden due to
the disabled scrolling on `html`. Reduce width of fixed elements
that will be visible in background and `html` so that they don't
occupy that extra space.

Also, I was over-thinking how we can get the scrollbar width. The
moment we allowed scrolling on `html`, it was easy to get the
scrollbar width.
2023-05-28 15:20:20 -07:00
Karl Stolley 060c95dda6 compose_box: Explicitly set topic bar text color. 2023-05-25 17:19:29 -07:00
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 fad5c88aa9 select_recipient_widget: Use "button" tag instead of "div".
Previously, hovering over the stream selector in the
compose box would show a mouse/text pointer instead
of a hand pointer.

Fixes #25592.
2023-05-14 16:35:48 -07:00
Aman Agrawal 393bcb4a9a compose: Increase font size of recipient privacy icon. 2023-05-10 12:00:18 -07:00
evykassirer e026aa1217 UI redesign: Change background color.
Fixes: #21750
2023-05-09 16:25:28 -07:00
Aman Agrawal 8ea59f7f02 compose: Use tippy for stream select dropdown.
Fixes #25434
2023-05-09 14:11:26 -07:00
Hardik Dharmani 2aaf098ebc compose: Shorter the separator line between Send and 3-dot buttons.
Added a div inside #send_later button with class separator-line,
height 70%, width 1px and `background-color: hsl(0deg 0% 100% / 65%)`
to make it look like a line also made #send_later a flex with
`align-items: center` so that separator line is vertically centered.
2023-05-02 11:05:45 -07:00
Aman Agrawal 578ddbc5c8 scheduled_message_banner: Change design.
Convert `View scheduled messages` button into a link and use
default colors for "Undo" button.
2023-05-02 09:10:58 -07:00
Aman Agrawal 1885ed783a compose: Add new banner for success message scheduled. 2023-05-01 22:45:03 -07:00
Aman Agrawal 1b60019c60 schedule: Remove 'Schedule' state of compose box.
Fixes #25340

This means that we now schedule the message simply after selecting
time if the message is valid.

Also, editing scheduled messages will now delete the scheduled
message and open compose with scheduled message.
2023-05-01 22:45:03 -07:00
Tim Abbott 368d2aa27d compose: Fix misaligment of compose top right icons.
When composing a private message to a different recipient than the
current view, the go-to-compose-target icon looked vertically
misaligned with these icons. Fix this by removing the CSS rule that
made these other top-corner icons not centered within their row.
2023-04-30 21:02:21 -07:00
Tim Abbott cef1e3363c compose: Increase size of recipient menu.
We should do a better long-term fix, but the current menu feels cramped.
2023-04-28 18:44:11 -07:00
Tim Abbott 798391824b compose: Refactor dropdown-menu CSS rules. 2023-04-28 18:43:51 -07:00
Karl Stolley df508659db css: Lighten button border for visibility.
This replaces the previous dark border.

A pure white border looked a little too garish, so this dials back the
alpha channel just a bit.

Fixes: #25303.
2023-04-28 12:44:30 -07:00
Karl Stolley 942eb7b375 css: Pad send button for click comfort. 2023-04-28 12:44:30 -07:00
Karl Stolley d9654f4f0a css: Introduce padded vdots for send later.
This uses eyeballed vertical padding on the nested .zulip-icon class
to ensure that the entire send-later button area is clickable (and
not merely hoverable).
2023-04-28 12:44:30 -07:00
evykassirer 18312be6db compose: Add ability to switch to PM in stream dropdown.
Fixes #3409
2023-04-27 17:04:19 -07:00
evykassirer 6c797904f2 compose: Let recipient switcher change width with content. 2023-04-27 17:04:19 -07:00
evykassirer 695946746e compose: Rename stream selection widget to "select_recipient".
Previously this dropdown was only for selecting streams, but
soon it will also be for switching to a private message. This
name helps it be clearer that the dropdown is more general
purpose.
2023-04-27 17:04:19 -07:00
Sahil Batra 7eacd525b4 compose: Show banner if user is not allowed to post in the stream.
We now show a banner on opening the compose box and changing the
stream in dropdown, if a user is not allowed to post in a stream.

The "Send" button is also disabled if user is not allowed to post
in the stream.

This commit also moved the CSS for disabled modal button in dark
theme below after the other CSS for modals as we are using the
same CSS for the "Send" button as well in disabled state.
2023-04-27 12:31:40 -07:00
Daniil Fadeev 980f7df376 compose: Fix banners running off the screen.
We introduce a scrollable region, with a simplebar scrollbar.

Fixes: #25115.
2023-04-26 14:03:34 -07:00
N-Shar-ma 9f2ef69c71 compose: Add banner for unmuting the muted topic a message is sent to.
We add a new banner informing the user if and when they send a message
to a muted topic / stream. It also has a button to unmute the topic.

Fixes: #24246.
2023-04-25 16:16:47 -07:00
evykassirer 5948671f92 compose: Improve responsiveness for compose recipient.
This allows the dropdown to display larger names, and also
overall improves the compose recipient experience on small
screens.
2023-04-20 16:09:55 -07:00
evykassirer 5ca73388c0 compose: Overflow long stream names with ellipsis in dropdown menu. 2023-04-20 16:09:55 -07:00
evykassirer 19a47a71d8 stream dropdown: Add a space after the stream icon.
This applies to several dropdowns, and matches the spacing of
the left sidebar.
2023-04-20 16:09:55 -07:00
evykassirer 02ae5818ae compose: Add privacy icons to the stream dropdown menu.
These were previously used in the input form field and
this commit removes the code that supported that and
replaces it by using existing dropdown_widget functionality
to display the icons in the compose dropdown.
2023-04-20 16:09:55 -07:00
evykassirer 8a2455a294 compose: Change stream field in composebox to be a dropdown.
Fixes #11832

This lets the user see more options than the three that appear
in the typeahead menu, and prevents them from inputting invalid
stream names.

This change replaces the input field with the dropdown, and
updates everything that referred to the classnames of the old
input field, so that they now get the data they need from the
new dropdown.
2023-04-20 16:09:55 -07:00
Aman Agrawal ff52187289 compose: Add UI to schedule messages.
Fixes #20971
2023-04-17 16:59:25 -07:00
Lalit fd830ce453 popover_menus: Change the selector `.enter_sends` for opening tippyjs popover.
Changed the `.enter_sends` css selector for launching tippyjs popover from
`compose.hbs` because it was colliding with `.enter_sends` selector present in
`organization_user_settings_defaults.hbs`.

Before this change when an admin tried to change user realm default setting of
`enter_sends` it was opening a tippyjs popover despite being a checkbox and it
was hitting `/json/settings` endpoint instead of `/json/realm/user_setting_defaults`.
2023-04-05 12:05:44 -07:00
evykassirer 1e62a42d75 compose: Reduce height of compose banners to better match designs.
Figma: https://www.figma.com/file/jbNOiBWvbtLuHaiTj4CW0G/Zulip-Web-App?node-id=2441%3A180271&t=tFynBT5Akes5HJ95-0
2023-03-31 13:52:31 -07:00
evykassirer 4cfafa382a compose: Rename recipient selector classes to be more descriptive. 2023-03-31 13:45:24 -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
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 <anders@zulip.com>
2023-02-23 16:04:17 -08:00