Commit Graph

418 Commits

Author SHA1 Message Date
Brock Whittaker e4761782e0 Fix Small Image Preview Sizing.
Before the sizing of the preview would be 100px in height regardless of
whether the image was that tall. Now it is any value up to 100px.
2017-01-03 15:59:25 -08:00
Brock Whittaker 50f6681319 Fix z-index Issues.
This fixes the z-index issue with the navbar along with hiding any
popovers when you enter into the lightbox.

Fixes #3078.
2017-01-03 15:33:54 -08:00
Tim Abbott 2ef19901dd notifications: Improve HTML/CSS for desktop notifications. 2017-01-02 16:42:04 -08:00
Tim Abbott ec3e5e844a reactions: Clean up popovers and hover logic.
Previously, the emoji reactions popovers were keyed off the
edit_content area, which is problematic because that area was
created/deleted on hover, resulting in orphaned popovers (which
wouldn't close properly normally).  That had been hackishly addressed
in the original PR with the overbroad `$('.popover').remove();`.  To
remove that, we fix the actions popover to always be based on an
element that exists in the page.

There probably more to do here, but this is good enough to merge emoji
reactions and iterate from here.
2016-12-30 21:42:54 -08:00
Arpith Siromoney 9c64a08cad Add frontend support for emoji reactions.
This commit replaces the placeholder "clipboard" button with a reaction button.
This is done on any message that can't be edited. Also, on messages sent by
the user the actions popover (toggled by the down chevron icon) contains
an option to add a reaction.

When clicked, a popover with a search bar and a list of emojis is displayed.
If the right sidebar is collapsed (the viewport is small), the popover is placed
to the left of the button.
Focus is set to the search bar. Typing in the search bar filters emojis.

Emojis with which the user has reacted to this message are highlighted.
Clicking them sends an API request to remove that reaction.
Clicking on non-highlighted emojis sends an API request to add a reaction.
When the popover loses focus it is closed.

The frontend listens for reaction events. When an add-reaction event is
received, the emoji is displayed at the bottom of the message with a
count initialized to 1. If there was an existing reaction to the message with
the same emoji, the count is incremented.

Old messages fetched from the server contain reactions.
They are displayed (along with title and count) at the bottom
of each message.

When clicking the emoji reaction at the bottom of the message, if the
user has already reacted with that emoji to this message, the reaction
is removed and the count is decremented. Otherwise, a reaction is added
and the count is incremented.

Hovering over the emoji reaction at the bottom of the message displays
a list of users who have reacted with this emoji along with the
emoji name.

Hovering over the emoji reactions at the bottom of the message displays
a button to add a reaction.

Fixes #541.
2016-12-30 21:42:54 -08:00
Sanskar Modi dee5a0c8d7 Added styling on compose notification warning button.
With CSS suggestions from Tommy Ip.
2016-12-27 15:21:20 -08:00
Steve Howell a96fdd18b1 Make Private Messages work better when zoomed in.
Some of the work here was done Tomasz Kolek.

When we click on "more conversations" in "Private Messages,"
we call it being "zoomed in."  Before this change, when
new PMs arrived, we would rebuild the list and zoom out
again.  Now we track the zoomed_in state with a variable.
Also, if you are zoomed in and switch from one PM narrow
to another, we also keep you zoomed in.

This fix also removes some extraneous/redundant code.

Fixes: #2561
2016-12-27 13:36:30 -08:00
Brock Whittaker 51153a6ce2 Change scope of pointer events for lightbox overlay.
This was intercepting pointer events even though the lightbox was
closed. This fixes the issue with the streams exit not working in some
responsive cases.

Fixes: #2818.
2016-12-26 18:31:18 -08:00
hackerkid 713b69ceab Fix position of restore draft button.
The Restore draft button currently appears before Markdown preview
button. This commit moves restore draft to right most position.
2016-12-26 18:30:58 -08:00
Tommy Ip 7b6603b169 admin: Fix strike-through styling in users & bots tab.
Fix an issue where the `deactivated_user` class is unintentionally
applied to the reactivate user and reactive bot buttons.

Fixes #2905.
2016-12-26 14:51:12 -08:00
Brock Whittaker 41f6420df0 help: Add Tip CSS.
This adds the CSS for a tip section. Utilizes the CSS ::before
pseudo-selector and fontawesome.
2016-12-21 15:40:55 -08:00
JefftheBest1 0e6078fade Wrapped text in admin user and bot tables.
Fixes: #2569.
2016-12-21 14:55:50 -08:00
Akhil 06615bee00 streams: Implement copy-subscribers feature.
In the new stream creation modal, added checkboxes for each stream
and a toggle to see or hide the checkboxes. Altered filtering to
filter streams and users. Added corresponding casper tests.

When a stream is checked/unchecked, it does not affect the state
of any user checkbox. This may be visually unclear as users can be
added even if their checkboxes are empty.

Fixes #2448
2016-12-17 11:20:47 -08:00
Brock Whittaker 105ef7caae Add markdown page styling.
This styles inline images, the markdown page as a whole, and the
notification buttons to be CSS rather than images.

[Tweaked by tabbott to temporarily remove the Yantramanov font, since
we should be committing that to the repo so Zulip works correctly without
Internet access]
2016-12-15 21:59:58 -08:00
Brock Whittaker 36319ca501 Give the #home entry in the gear menu an invisibility cloak.
Previously, this would create a weird blue banner across the top of
the gear menu.

We can't remove it, since it’s required for the gear menu navigation.

Description edited by tabbott.
2016-12-15 18:13:33 -08:00
Brock Whittaker 706b2e7978 Absolutely position the .recipient_row_date.
Firefox doesn’t handle multiple floats well so this is a better
solution — to absolutely position it in the recipient row container.
2016-12-14 15:44:54 -08:00
peguin40 01a0d11705 Show markdown help in message editing UI.
Fixes #2578.
2016-12-13 20:49:39 -08:00
Brock Whittaker a460fcddef Add Date Headers to Floating Bar and Message Headers.
This adds the date of a block of messages to the floating recipient
bar along with message headers of blocks that are the first of a
particular day.
2016-12-13 20:36:39 -08:00
Brock Whittaker 2fc803786b Fix margins in Subscriptions Overlay.
There is a case with browser zoom that the inline-block split view
breaks down and the two 50% tabs fall below each other. This prevents
that issue from happening.
2016-12-13 20:35:14 -08:00
Brock Whittaker a3fcc6e026 Change groups of muted topics to be less translucent on hover.
On hover, the transparency of muted stream/topic groups should turn up
to 0.6 so that they are easily readable by people looking to find a
particular stream/topic, but not completely opaque as to be confused
with a non-muted item.

Fixes: #2487.
2016-12-13 14:24:56 -08:00
Brock Whittaker 1886f0a015 redesign: Convert subscriptions page to overlay.
This is a major change to the /#subscriptions page, converting it to
by a side-by-side list of streams and their settings in an overlay.
There are no new features added/removed, but it's a huge changeset,
because it replaces the old navigation logic and moves the stream
creation modal to appear in the right side of this overlay.
2016-12-09 11:08:08 -08:00
Brock Whittaker 9823e4de33 components: Change label.checkbox style.
Change the label.checkbox style to be grey instead of green which I
think blends with the current aesthetic more.
2016-12-08 11:49:45 -08:00
Tomasz Kolek 9933abf833 css: Fix problem with too long stream name on stream deletion modal.
Add overflow-wrap rule to zulip.css for deactivation_stream_modal h3.

Fixes: #2596.
2016-12-07 21:23:23 -08:00
Tomasz Kolek 4fe3cd98f8 css: Fix problem with too long stream name in left sidebar.
Add overflow-wrap rule for .stream-name class to left-sidebar.css.
2016-12-07 21:21:47 -08:00
Tomasz Kolek eac002c6bd css: Fix problem with too long stream error formatting.
Add overflow-wrap rule for #response span to subscriptions.css.
2016-12-07 21:20:57 -08:00
Igor Tokarev c93f1d4eda Add oembed/Open Graph/Meta tags data retrieval from inline links.
This change adds support for displaying inline open graph previews for
links posted into Zulip.

It is designed to interact correctly with message editing.

This adds the new settings.INLINE_URL_EMBED_PREVIEW setting to control
whether this feature is enabled.

By default, this setting is currently disabled, so that we can burn it
in for a bit before it impacts users more broadly.

Eventually, we may want to make this manageable via a (set of?)
per-realm settings.  E.g. I can imagine a realm wanting to be able to
enable/disable it for certain URLs.
2016-12-07 17:40:18 -08:00
Brock Whittaker 83ca1ab149 register: Make /register responsive again.
After some tremendous changes the container now shouldn’t break badly
on narrow screens as flexbox doesn’t set it off the screen.
2016-12-07 15:33:57 -08:00
Tim Abbott d184288e00 css: Add box-shadow and bg-white components. 2016-12-02 13:03:43 -08:00
Tim Abbott 6e86515b15 css: Move display-none and inline-block to components.css. 2016-12-02 13:03:43 -08:00
Tim Abbott a7681c3c2f css: Move .light to components.css. 2016-12-02 13:03:43 -08:00
Brock Whittaker 7fd15984fc components: Add a new settings page checkbox.
This allows us to style checkboxes to be transparent boxes with green
borders.
2016-12-02 12:06:49 -08:00
Brock Whittaker b837221e05 Fix for possible webkit painting bug.
The left sidebar will overflow its bounds (even when set to overflow:
hidden) and go behind other text on the sidebar above. By setting the
z-index to 0 we seem to solve the problem.

This is probably actually a webkit bug, but this makes it no longer
affect us.

Fixes #1899.
2016-11-29 15:29:59 -08:00
aakash-cr7 73fb9c6f66 Fix alignment of 'Not Delivered buttons' on smaller devices. 2016-11-26 10:13:48 -08:00
aakash-cr7 79b4ac8155 Add tooltips to buttons appearing when message is not delivered. 2016-11-26 10:13:48 -08:00
aakash-cr7 0525b65f90 Fix positioning of error message appearing on adding custom alert words.
Fixes #2413.
2016-11-26 10:11:55 -08:00
Vladislav Manchev d7e1e4a2c0 Add initial implementation of custom realm filters.
This PR was abandoned by Vladislav and then substantially modified by
Igor Tokarev and Tim Abbott to complete it and fix a number of bugs.

Fixes #544.
2016-11-17 17:11:25 -08:00
Tomasz Kolek ea58005796 Fix styling in api_key_box section on settings page.
Before fix, "Your API key" section was to close left side of the box.
2016-11-15 09:32:10 -08:00
Steve Howell e732892654 css: De-duplicate some common styles for unread counts. 2016-11-14 16:16:55 -08:00
Steve Howell 7c1711179c Rename subject_count class to topic-unread-count. 2016-11-14 16:16:55 -08:00
Brock Whittaker d45c050994 message_edit: Restyle message_controls options to have better spacing.
This restyles the message_controls options to center them horizontally
while fixing them closer to the right side of the edge, along with just
replacing the edit button with a preview source button once editing is
disabled.
2016-11-10 19:47:26 -08:00
Brock Whittaker 5497416a36 Move edit button to underneath message timestamp.
This moves the edit button to underneath the timestamp such that when
you hover over a message now the timestamp hides itself and the edit
button appears (if editing is allowed).

Fixes #1733 and other annoying issues with this field.
2016-11-10 19:45:09 -08:00
Brock Whittaker 129d88825c messages: Wrap inline code blocks on long lines.
In 25b28bf82c and then
cb1bc70ab0, we attempted to make long
code blocks scroll in a reasonable fashion, without much success.

This change causes code blocks to be line-wrapped, without needing to
set `overflow-y: hidden` for paragraphs (which cause problems with
taller elements like emoji that overlfowed wrong).  Our octopi finally
have legs again.

It's not clear that this is the final answer, but it's the best
version we've found so far.
2016-11-09 19:26:45 -08:00
Steve Howell debc06b449 Rename subject-name to topic-name and move CSS to left-sidebar.css. 2016-11-05 15:03:29 -07:00
Steve Howell 06fe4bc943 Rename subject_box to pm-box/topic-box.
I'm not crazy about the names pm-box and topic-box, but they
are less confusing now.
2016-11-05 15:03:29 -07:00
Steve Howell 43c372bfb6 css: Clean up styles for subject_box.
These styles are uniform for now, so we don't need a complicated
selector.
2016-11-05 15:03:29 -07:00
Steve Howell e38b684eea Simplify CSS for topic-sidebar-arrow. 2016-11-05 15:03:29 -07:00
Steve Howell b1f288dddb topic lists: Rename expanded_subject to topic-list-item. 2016-11-05 15:03:29 -07:00
Steve Howell 8b7e9101ca topic lists: Rename expanded_subjects -> topic-list. 2016-11-05 15:03:29 -07:00
Brock Whittaker ee8d54db0f Change content to rely on data-* attribute.
Content now relies on the data-no-description attribute which then
allows for it to be embedded in HTML and therefore translatable.
2016-11-04 17:26:53 -07:00
Brock Whittaker 4400665a6d subs: Move stream settings into an independent overlay.
This replaces the scrolling stream settings feature with a stream
settings overlay.
2016-11-04 17:13:26 -07:00