Commit Graph

3150 Commits

Author SHA1 Message Date
Tim Abbott 85a7325757 css: Delete orphaned starred messages CSS.
This CSS stopped being used in
84afc67369.
2021-04-14 11:50:07 -07:00
Tim Abbott b7cfefc213 css: Add custom styling for starred message counts.
We use an inverted color scheme to what we use for unread messages, so
that one's eyes scan these as different from unreads.

We also need to introduce a 1px offset because the border takes up space.

Fixes #17938.
2021-04-14 11:43:38 -07:00
Aman Agrawal 97496088c9 recent_topics: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Aman Agrawal 6744522229 user_presence_row: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Aman Agrawal ab87325fea pm_list_item: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Aman Agrawal 019afcd40d topic_list_item: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Aman Agrawal b6d9577b48 stream_list: Use `unread_counts` class for showing unread count. 2021-04-14 10:57:16 -07:00
Aman Agrawal 84afc67369 top_left_corner: Directly use `span.unread_count` to display unreads.
In an effort to use a common class to display unread counts across
the app, we simplify the elements used to show unreads and use a
single `span` with `unread_count` class to do so.
2021-04-14 10:57:16 -07:00
Aman Agrawal b1f8041c31 giphy: Use simplebar to replace browser scrollbar. 2021-04-14 10:50:47 -07:00
Aman Agrawal 35bd44ed2a giphy: Add clear search button.
Make the input more square looking to match with our other
input boxes.
2021-04-14 10:50:47 -07:00
Aman Agrawal 84f7bb85f6 giphy: Make footer background black to match to with attribution.
Adjust border-radius to make edges smooth.
2021-04-14 10:50:47 -07:00
Aman Agrawal 6271a7db9c message_controls: Don't set css properties for all `div`s in it.
This tends to behave badly when we add new elements which don't
want these properties.
2021-04-14 10:15:58 -07:00
Tim Abbott 0dac331c17 css: Adjust scope for main overlay CSS and click handlers.
KaTeX makes use of a "span.overlay" element for the little vector
arrow symbol on top of a `\vec` object. This conflicts with Zulip's
CSS for our overlays, which are divs with the `overlay` CSS class.

While KaTeX may rename their class
(https://github.com/KaTeX/KaTeX/issues/1456), we can work around this
issue by scoping our own overlay CSS and click handlers to
"div.overlay" rather than ".overlay".

Fixes #18068.
2021-04-14 08:27:18 -07:00
Siddharth Asthana 7c485c1302 integrations page: Add "Create your own" button.
This commit adds a "Create your own" button on the integrations page. It
redirects to "api/integrations-overview" page and is placed by the side
of "Request an Integration" button.

Fixes #7935
2021-04-13 21:03:48 -07:00
majordwarf 4b3290566b docs: Document integration request process.
There was no proper documentation to guide user to request an integration.
The following changes documents the whole process and links it from the
`/integrations/` page making it visible to the end-user.

Fixes #7935
2021-04-13 20:48:34 -07:00
akshatdalton b9a318485c bots settings: Stop modal from getting closed when an error is shown.
This commit fixes the issue of error message not getting
displayed when the `Full name` field, in bots settings, is given
a duplicate name of an already created bot with the same name.

We were closing the modal each time whether the request is
successful or not. Hence, we now close the modal only
when the request is successful and error is displayed on
the modal otherwise.

Fixes #18091.
2021-04-13 11:42:36 -07:00
Rutvi Sharma 71edbd47d5 style: Increase width of gear menu to avoid distracting hover.
The comment explains the reasoning, but this should make it a lot
easier for users to visually focus on the menu items in the sidebar.

Changed by tabbott to use the same width as the right sidebar itself.

Inspired by #17169.
2021-04-09 15:52:37 -07:00
TylerPham2000 4dacbfdc82
panels: Adjust opacity value for the exit widget.
This makes this icon less invisible.

Once the user hovers over the "x" it will become brighter to notify the user.
2021-04-09 14:49:50 -07:00
Sumanth V Rao 164506d950 css: Fix vertical alignment mismatch for view_in_playground button.
We'll be changing the icon and probably even doing the alignment in
a better fashion in the future, so this is just a temporary fix
till then.
2021-04-07 21:06:36 -07:00
Anders Kaseorg 8f0f0b9e91 styles: Slightly increase monospace font size.
Commit d84727ce7f (#17970) slightly
decreased the apparent size on some platforms depending on which font
was in use before, and some users complained that it was a bit hard to
read.  Based on experiments with multiple platforms and monitors and
resolutions, this appears to be a good compromise that increases the
rendered height without increasing the width more than necessary.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-04-07 13:17:20 -07:00
Aman Agrawal 18907eac33 tippy: Set default font size to 12px.
The default font size for tippy before was 14px and it appears large
for a tooltip compared to rest of the content.
2021-04-07 01:16:29 -07:00
Anders Kaseorg d84727ce7f styles: Use Source Code Pro as our monospace font.
Fixes #15993.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-04-05 15:18:41 -07:00
Anders Kaseorg 236e114870 styles: Consistently use generic fallback font families.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-04-05 15:18:41 -07:00
Aman Agrawal 5e83965e80 giphy: Use GIPHY web SDK to allow inserting GIFs in compose box.
We use GIPHY web SDK to create popover containing GIFs in a
grid format. Simply clicking on the GIFs will insert the GIF in the compose
box.

We add GIPHY logo to compose box action icons which opens the GIPHY
picker popover containing GIFs with "Powered by GIPHY"
attribution.
2021-04-05 15:04:49 -07:00
Aman Agrawal f7f5308986 recent_topics: Don't change background color on thead hover.
We expect to give recent topics a cleaner look by doing so.

Fixes #17934
2021-04-03 07:41:01 -07:00
Palash Singh Raghuwanshi 7c43f1e2f7 static: Fix setting gear to be not active when app loads.
From the commit history, this typo has always been there; because it
had the same priority as the `opacity: 0.5` for that element,
it can be nondeterministic whether the bug appeared.

Fixes #17476.
2021-04-02 18:15:00 -07:00
Anders Kaseorg 0868641ea4 Revert "static: Make alert-box available for portico pages."
This reverts commit a00f5dd90e (#17801).

That commit introduced a regression in the portico pages as described
in commit 85b3157b47.  Since that fix
introduced a regression of its own, we need to revert both commits for
now.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-04-01 15:25:23 -07:00
Anders Kaseorg 6a877890b8 Revert "css: Fix webapp alert styling incorrectly applying to portico."
This reverts commit 85b3157b47.

This broke the × button on Blueslip alert boxes, because @extend does
not work across different PostCSS compilation units.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-04-01 15:25:23 -07:00
Tim Abbott 85b3157b47 css: Fix webapp alert styling incorrectly applying to portico.
In a00f5dd90e, we needed to move the
`alert-box` styles from alerts.css to be visible in portico pages.
However, when doing so, we incorrectly moved all of alerts.css, which
also has styles for `alert` and` alert-error` designed to make it
convenient to include hidden elements for potential errors in the
webapp settings UIs directly in the HTML template (and then use
show/hide to manage them).

We fix this by moving just the alert-box scope to the common
components.css module, which is designed as the place for styles
shared between the webapp and portico pages.

This fixes an issue where the error messages for wrong password and
the like were invisible :(.
2021-03-31 10:06:40 -07:00
aryanshridhar 134a6f8bba edit_bot: Fix dropdown username capitalization.
Restructured dropdown_list_widget template to unwrap label tag
from the control group, hence defaulting the edit_bot
dropdown items to their original text size.
2021-03-30 16:14:42 -07:00
Anders Kaseorg e642b8e777 rendered_markdown: Add horizontal scrollbar to overflowing ```math.
Fixes #14422.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-03-28 19:03:40 -07:00
Sumanth V Rao e925ec6c41 css: Hide copy-paste button for codeblocks in formatting help overlay.
We missed out on this during our previous efforts to add a copy-to-clipboard
icon in codeblocks (42d30bc14b).
2021-03-26 09:46:09 -07:00
PIG208 a00f5dd90e static: Make alert-box available for portico pages. 2021-03-26 09:41:08 -07:00
Anders Kaseorg d22a61443e notifications: Remove in_browser_notify and bootstrap-notify.
Follow up to #14768.  This feature was already non-functional due to
.alert-display { display: none; }, and if we want to reimplement it,
we should do it using a modern library.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-03-22 23:40:38 -07:00
Anders Kaseorg aff8a32bc1 notifications: Simplify sound playing.
Remove the unused notifications-area wrapper.  Remove the feature
detection code as all browsers recognize the <audio> element.  Create
the <audio> statically with the page template.  Use multiple <source>s
to let the browser detect the appropriate format instead of trying to
do its job for it.  Remove the absurd loop="yes" attribute, which had
fortunately been specified on the wrong element.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2021-03-22 23:36:38 -07:00
Gaurav Pandey dea5245590 right-sidebar: Fix design bugs with keyboard-shortcuts.
The keyboard-shortcuts icon currently has a fix position
causing design related bugs such as overlapping with userlist
in the sidebar.

The fix wraps the invite-more-users link and keyboard icon inside
a div with display property as flex instead of just using the anchor
tags inside the side-bar items.
2021-03-22 19:29:46 -07:00
Signior-X 31b7eb7439 style: Fix the vertical alignment in message controls.
This commit adds vertical-align: middle to .message_failed in zulip.css
which was necessary as the alignment of .message_failed wasn't matching
with rest of the message controls like .edit_content. This makes the
look of the message controls better that they don't look shifted.

Follow up #17666
2021-03-21 17:38:14 -07:00
Gaurav Pandey 7ddf6435a9 left-sidebar: Remove add-streams option out of scrollbar.
This commit removes the option to add more streams out of scrollbar
as it is not visible on mobile devices or organizations with large number of
streams until scrolled down.
2021-03-16 14:10:04 -07:00
Abhijeet Prasad Bodas 9223dced3b refactor: Rename filter to linkifier in frontend code and docs.
This only leaves `page_params.realm_filters`, which
will be changed in further commits along with the
API change.
2021-03-15 11:19:59 -07:00
Tim Abbott e1aa7dd882 portico: Fix line-wrapping of bulleted lists with 2-digit numbers.
As demonstrated with the recent Zabbix integration, our line-wrapping
of numbered lists was busted in the presence of 2-digit numbers of steps.

Fixes #17634.
2021-03-14 19:36:29 -07:00
m-e-l-u-h-a-n e781136acd css: Add separate class for typeahead items with no presence circle.
This commit adds a new class for typeahead items that do not need
a presence circle. It is changed to support addition of new items
that do not require presence circle.

There should not be any visual change due to this.
2021-03-12 02:10:21 -08:00
m-e-l-u-h-a-n 629aeced16 compose: Remove presence circles for wildcard users.
This commit removes presence circles for special users like
all, stream, and everyone. This was discussed at
 #design>Presence circles in typeahead, and this was justified
as presence circles for these special users will always be grey
circle and do not convey any information about presence of anyone.
2021-03-12 02:10:21 -08:00
m-e-l-u-h-a-n cd0d3347ab compose: Fix spacing of presence circles in typeahead.
This commit increases spacing between presence circles and user avatar
in typeahead suggestions.
These changes were discussed in #design>Presence.
2021-03-12 02:10:21 -08:00
Josh Gilley de74d2fd7c settings: Use HTML table for "Alert Words" for better icon alignment.
"Alert Words" is one of Zulip's oldest settings UI elements, and as a
result is buggy.  This commit converts it to use our standard
progressive-table-wrapper system used for settings tables, which has
the side effect of fixing a bug that mad ethe tables look pretty bad
if one adds a very long word.

Fixes #17172.
2021-03-05 14:38:56 -08:00
smit_patel fb8d18caf8 compose: Fix alignment of Drafts button.
Fixes #17095.
2021-03-04 17:33:01 -08:00
m-e-l-u-h-a-n f4a111e314 compose: Add user presence circles in mention and pm typeahead.
This commit addresses the problem of user's status visibility to
some extent. It adds presence circles, like we have in buddy_list to the
typeahead suggestions that are given for mentioning users in messages.

Tweaked by tabbott to adjust vertical alignment of group mentions as well.

Testing for the changes is done manually in the developement server,
and also by updating frontend tests to address these changes.

Fixes: #17138
2021-03-04 17:06:02 -08:00
Tim Abbott 7def3e7832 css: Fix vertical alignment of mention typeahead.
Somehow the previous styling was oddly off-center.
2021-03-04 17:05:04 -08:00
Gaurav Pandey 3dcf97bf27 tooltip: Hide tooltip for touch events on touch-enabled devices.
Fixes #16674.
The commit hides the tooltip for touch events on touch enabled device.

Touch events trigger both click and hover action,
leaving the hover action sustained until next click.

Hence it is better to hide the tooltip to avoid the clutter in UI.
2021-03-04 12:32:16 -08:00
Gaurav Pandey a3561c15d2 invites: Remove odd box-shadow for invite link clipboard svg. 2021-03-03 21:57:41 -08:00
Aryan Shridhar bfefec31f4 Revert "edit_bot: Fixed dropdown username capitalization."
This reverts commit ea02d48e81.
2021-03-03 23:58:50 +05:30