Commit Graph

3076 Commits

Author SHA1 Message Date
SiddharthVarshney af09b49ae7 css: Use SCSS nesting for `.screen .line`. 2020-08-04 16:24:12 -07:00
Gittenburg 4cd23103db message feed: Make message controls more accessible.
We already have single-key shortcuts for all message controls but Zulip
should be usable from the keyboard without having to learn a bunch of
Zulip-specific keyboard shortcuts.
2020-07-30 16:53:00 -07:00
YashRE42 b4891a5841 navbar: Rename tab_bar to message_view_header.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base.

We purged tab_list in 1267caf5009118875f47fdafe312880af08024e1.

This commit purges tab_bar, it includes:
- A blanket search and replace of tab_bar with message_view_header.
- Splitting a single line comment in
  tab_bar.js / message_view_header.js.
- The renaming of tab_bar.js to message_view_header.js.
- The renaming of tab_bar.hbs to message_view_header.hbs.
- A blanket search and replace of tab_data with
  message_view_header_data.
- Replacing the single occurrence of tabbar with message_view_header
  (it was within a comment.)
2020-07-30 16:23:13 -07:00
Anders Kaseorg efcba21100 styles: Reorder rule to work around weird postcss-nested bug.
For mysterious reasons, this avoids the following message printed by
webpack on a cold cache after upgrading postcss-nested from 4.2.1 to
4.2.2:

Ignoring local source map at "/srv/zulip/<no source>" as resource is missing.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-30 11:20:03 -07:00
Gittenburg ccaab2d471 docs: Restore link focus outline in sidebar.
Not having a focus outline is very bad for accessibilty.
Browsers have it by default but we completely disabled it for links in
the sidebar in 9955580251.

Showing the outline when selecting a page in the sidebar can be
distracting, so we hide the outline for the highlighted sidebar link.
Since every focusable element however should have a focus outline, we
make the highlighted link unfocusable by setting tabindex=-1 (which also
makes sense since the link to the current page doesn't do anything
anyway).

Part of #15948.
2020-07-29 11:40:39 -07:00
Priyansh Garg c752f955de registration: Improve registration form.
Improved markup of help-text.
Showing Email as plain-text instead of disabled input.
Changed page heading to 'Create your organization' in realm creation form
and 'Create your account' in normal signup form.
Grouped org settings and user settings with fieldsets.
Reduced space between Password field and Password strength bar.

Also, updated the corresponding test cases.

Partially Fixes: #15750.
2020-07-28 17:07:25 -07:00
Aman Agrawal b34d46e00b css: Rename #home id to #message_feed_container. 2020-07-28 16:33:32 -07:00
Gittenburg 253ae8ee51 css: Remove hover effect over active sub filter.
Previously when hovering over a selected topic in the left sidebar
a barely different hover color was employed (and overriden in the dark
mode). This resulted in a small UX issue because after selecting a topic
in the sidebar it should immediately be colored as such (and not just
after moving the mouse cursor away).
2020-07-28 15:30:54 -07:00
Gittenburg 12fe4301e5 css: Unify sidebar hover effects.
Previously the left sidebar used a darker hover background than the
right sidebar, presumably to stand out more when hovering over an active
filter (which have a blue background in the light theme).  This can be
more elegantly solved by using a transparent hover background.
2020-07-28 15:30:54 -07:00
Gittenburg 2367d56f74 integrations: Fix the search input autofocus.
There were two problems preventing the autofocus:

* The focus was triggered at the wrong time.
* transition: all; affected the visibility, making browsers
  abort the focus since the input was still hidden.
2020-07-28 15:17:00 -07:00
Vishnu KS 5b0b1efb15 support: Add functionality to approve sponsorship requests.
This should make it much easier to process these requests.
2020-07-24 17:55:38 -07:00
Vishnu KS 1a1396d07e support: Show customer plan details in support page. 2020-07-24 17:37:41 -07:00
Gittenburg 02485441fd message_edit: Fix invisible delete spinner.
Introduced in 953d475274.
2020-07-23 10:24:15 -07:00
SiddharthVarshney 67cee7c8f9 css: Use SCSS nesting for `.faqs`. 2020-07-22 16:58:14 -07:00
SiddharthVarshney ba36b99cd2 css: Use SCSS nesting for `.faqs .faq`. 2020-07-22 16:58:14 -07:00
SiddharthVarshney 4d2593a6bf css: Use SCSS nesting for `.faqs header`. 2020-07-22 16:58:14 -07:00
SiddharthVarshney f28c729707 css: Use SCSS nesting for `.compare`. 2020-07-22 16:58:14 -07:00
SiddharthVarshney 04bcab0f4c css: Use SCSS nesting for `.compare .terms`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney 04a49fc402 css: Use SCSS nesting for `.compare tbody tr`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney fb1a593281 css: Use SCSS nesting for `.compare tbody tr td`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney 4c0a4d4cef css: Use SCSS nesting for `.compare thread`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney 457023dde6 css: Use SCSS nesting for `.compare thread th`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney 456c0b78e0 css: Use SCSS nesting for `.compare table`. 2020-07-22 16:58:13 -07:00
SiddharthVarshney f1c70be50a css: Use SCSS nesting for `.compare table thead th`. 2020-07-22 16:58:13 -07:00
jagansivam28 dac8f4f20f upload widget: Realign upload widget text to center. 2020-07-21 16:19:21 -07:00
jagansivam28 5f874a51f7 upload widget: Rename image upload widget upload text CSS class.
Previously, image upload widget delete text CSS class name was
`settings-page-upload-text`.
We can change the CSS class name to `image-upload-text`
so that the name can be more generic.
2020-07-21 16:19:21 -07:00
jagansivam28 ad0ff10598 upload widget: Rename image upload widget delete text CSS class.
Previously, image upload widget delete text CSS class name was
`settings-page-delete-text`.
We can change the CSS class name to `image-delete-text`
so that the name can be more generic.
2020-07-21 16:19:21 -07:00
jagansivam28 90cb72b103 upload widget: Rename image upload widget delete button CSS class.
Previously, image upload widget delete button CSS class name was
`settings-page-delete-button`.
We can change the CSS class name to `image-delete-button`
so that the name can be more generic.
2020-07-21 16:19:20 -07:00
jagansivam28 d1b0a12c2d upload widget: Rename image upload widget background css class. 2020-07-21 16:13:24 -07:00
jagansivam28 1702f7f802 upload widget: Change image upload widget CSS class name.
Previously, image upload widget CSS class name was
`avatar-icon-logo-settings`  it is not relevant to the widget so
we can change the CSS class name to `image_upload_widget`
so that the name can be more generic.
2020-07-21 16:13:23 -07:00
SiddharthVarshney fb3484df52 stream-settings: Change checkbox UI.
These checkboxes will now be more consistent
in design as we have in other part of the UI.

e.preventDefault() is added inside the
stream_is_muted_clicked function will disable
the default checkbox and make sure click event
come from only <span> part of the checkbox.
2020-07-21 13:27:21 -07:00
SiddharthVarshney a179648f0b compose: Change style of `Press Enter to send` checkbox.
This checkbox style will now be more consistent
with checkboxes used in settings modal.
2020-07-21 13:27:21 -07:00
Anders Kaseorg c2f9db4602 logo: Update Zulip logo.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-16 01:37:08 -07:00
Tim Abbott 4f9f6b18e7 css: Fix recipient bar stream hover text color in night theme.
It's unclear what the purpose of this logic was, but testing confirms
that the text color is as expected without this in the day theme (so
it's likely a relic of an old design) and removing it fixes the hover
text being overridden to white in the night theme.
2020-07-16 01:14:03 -07:00
Aman Agrawal ddef014eea recent_topics: Patch colors.
Don't allow bootstrap to override row hover colors.
Show unread topics in same color as others.
2020-07-15 23:57:58 -07:00
YashRE42 78d511fd03 navbar: Clean up implementation of tab_bar.narrow_description hover.
This handler adds a neat little effect whereby hovering over the
clickable region to open the navbar triggers the search_icon hover
effect and is a neat little visual cue about what happens onClick.

The previous implementation was slightly messy because it fetched the
color and applied it via ".css(". This commit cleans it up by creating
and using the class "search_icon_hover_highlight" instead. We also
make the selectors more specific, ensuring they target children of
"#tab_bar", this was so because it was reasonable to expect someone to
define eg `search_closed` elsewhere and we wanted to prevent bugs when
that happened.
2020-07-15 18:56:06 -07:00
YashRE42 b554333421 night_mode: Fix search_icon hover regression.
In 9046fc1032 we updated the navbar.html
file so that our css selectors did not override each other and cause
annoying problems.

Unfortunately this caused a regression in night mode where the
search_icon didn't have the correct hover effect.

This fixes the regression by adding the selectors.
2020-07-15 18:56:06 -07:00
Gittenburg 797fb00791 styles: Hide focus outline for active links.
We still want it everywhere for accessibility.
2020-07-15 12:37:27 -07:00
Tim Abbott 5150e1f8cf css: Limit recent focus handler change to popovers.
In 9648e64d23, we added a clear outline
around focused link elements in popovers.

This was a good fix for popovers, but it's distracting for the
experience of clicking links in the sidebars and message feed.
2020-07-15 12:12:01 -07:00
Aman Agrawal c1b047b0d1 recent_topics: Use simplebar for scrolling. 2020-07-15 10:16:56 -07:00
Aman Agrawal 57b6f9179b settings: Fix simplebar scrollbar in org settings dropdown.
This commit fixes the dropdown_list_widget to use simplebar for
scrolling.

It was not being used because data-simplebar should not be inserted
to the element being rerendered. This commit adds a new element
wrapping 'dropdown-list-body' which was being rerendered and
data-simplebar is added to that new element 'dropdown-list-wrapper'.

Also, there should always be a max-height property on data-simplebar
element and it is also added in this commit.

There is also a change to set margin of 10px only on the first div
element and which is direct children of organization-settings-parent
element. This is correct because we only want margin to add some space
between the heading of subsection and the first setting of that
subsection. Previously, the margin was being added to first div of all
the other child containers also and this was adding unnecessary margin
to the first div element of different simplebar containers.
2020-07-15 10:16:56 -07:00
Aman Agrawal c4bbdf040e recent_topics: Fix search clear icon overflowing in next line.
Sometimes, the clear icon overflows on the next line on specific
widths. This makes sure it never happens by wrapping them in a
block.
2020-07-15 10:00:52 -07:00
Aman Agrawal d39b969c64 recent_topics: Add background color to avatars extra count. 2020-07-15 10:00:52 -07:00
Aman Agrawal 71cae3370c recent_topics: Hide participants and last msg time on <750px width.
This ensures the UI experience on <750px width doesn't look
like too many things packed in a small space.
2020-07-15 10:00:51 -07:00
Aman Agrawal e7a65fa688 recent_topics: Show action buttons next to topic.
We remove the action column and show action buttons next to topic
after unread count (if present). This save us a lot of extra space
on small window sizes.
2020-07-15 09:59:37 -07:00
Aman Agrawal 1ee09799e6 recent_topics: Don't wrap last message header and stream names. 2020-07-15 09:59:37 -07:00
Aman Agrawal 8951f77e5d recent_topics: Show read topics in a darker shade. 2020-07-15 09:59:37 -07:00
Gittenburg 9648e64d23 styles: Make focus outline work reliably.
For a:focus Bootstrap sets the following rules:

    outline: thin dotted #333;
    outline: 5px auto -webkit-focus-ring-color;

Firefox does not know -webkit-focus-ring-color and falls back to the
previous rule, making the outline invisible in darkmode.

Chromium has a bug[1] that makes outline: auto invisible when focussing
elements programmatically (which we do for the up & down arrow keys).

[1]: https://bugs.chromium.org/p/chromium/issues/detail?id=1105822

Fixes #15768.
2020-07-15 09:57:19 -07:00
Gittenburg 953d475274 settings: Fix saving indicator glitch.
jQuery's fadeOut() sets display: none using inline CSS.
This was overriden by .alert-notification since it used !important
to override the display: block set in loading.js.  Removing the latter
allows us to remove the !important, and doesn't seem to break anything.

Fixes #15759.
2020-07-14 16:29:39 -07:00
YashRE42 75cfd886b7 navbar: Fix disappearing left border when search opens.
Previously, we were experiencing a bug that caused the left border of
the searchbox/tab_bar to disappear when the searchbox was opened. This
bug was a result of the following changes:
- 4cdd7aed2b accidentally added this line
  as right: 2; instead of right: 2px;
- 46c966576d fixed this line to be
  right: 2px; but caused the regression.

This commit fixes the bug by deleting this line.
2020-07-14 00:37:40 -07:00
SiddharthVarshney 972a1019cf message_controls: Replace chevron-down with ellipsis-v icon.
After migrating chevron-down with ellipsis for
sidebar-menu, this commit will do the same for
message narrow for consistency.
2020-07-13 16:12:26 -07:00
SiddharthVarshney 1ea9e2841c message_controls: Make click area for icons more uniform.
Previously user have to click pixel perfect on the message controls
icons to achieve the click action.

This commit will uniformly increases the click target
area for the icons.

Tweaked by tabbott to avoid some weird glitches.
2020-07-13 16:12:06 -07:00
SiddharthVarshney d0fd0cae3f message-controls: Use <i> tag for starred message icon.
Throughout the codebase we use <i> tag for icons.
This commit will add <i> tag inside the starred message
div and fa classes are now used with this <i> tag.

The starred message div is now consistent with other
message_controls divs.

Tweaked by tabbott to use the name star_container for better
readability.
2020-07-13 15:59:12 -07:00
YashRE42 ae7ff04fe6 navbar: Purge tab_list label from code base.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base.

It would have been nicer if we could simply purge tab_bar from the
codebase and rename "#tab_list" so that we have an anchor and wrapper
structure in the html, but dropping the float: left on tab_bar causes
some confusing problems such as causing the horizontal border to
disappear and the search_box to shift out of its intended position and
so its simpler to get rid of tab_list from our code base first.

This commit:
- Removes the #tab_list wrapper div from tab_bar.hbs.
- Removes any #tab_list selectors from night_mode.scss so that they
  simply target based on "#tab_bar" instead of "#tab_bar #tab_list".
- Removes tab_list selectors from zulip.scss, so that #tab_list
  attributes now apply to the #tab_bar, in the process we drop the
  duplicated width property and reorder the attributes.
- Replaces all mention of #tab_list with #tab_bar in JS files.
2020-07-13 15:39:36 -07:00
YashRE42 632f62c8b6 navbar: Remove padding-top from #tab_bar CSS because it defaults to 0.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base. This commit pushes us towards that goal by simplifying
the future merge of the two CSS labels.
2020-07-13 15:39:36 -07:00
YashRE42 a050061494 navbar: Drop letter spacing from #tab_bar in CSS.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base. This commit pushes us towards that goal by simplifying
the future merge of the two CSS labels.

The letter-spacing attribute was set to its default value and so we
remove it and rely on the default.
2020-07-13 15:39:36 -07:00
YashRE42 f0882e8539 navbar: Remove unnecessary overflow attributes from #tab_bar CSS.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base. This commit pushes us towards that goal by simplifying
the future merge of the two CSS labels.

Currently the #tab_bar is just a container for the #tab_list and the
 #tab_list handles the overflow attributes and so these do not serve
any purpose.
2020-07-13 15:39:36 -07:00
YashRE42 e4f1dfe80b navbar: Remove height attribute from #tab_bar CSS.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.

However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base. This commit pushes us towards that goal by simplifying
the future merge of the two CSS labels.

We have the same selector within #tab_list and the duplication is
unnecessary.
2020-07-13 15:39:36 -07:00
YashRE42 437b9a1a90 navbar: Refactor >:nth-last-child(2) style to use scss nesting. 2020-07-13 15:39:36 -07:00
YashRE42 87c9d527ef navbar: Add comment in scss explaining the nth-last-child(2).
Ideally we would not be relying on something that requires a 4 line
comment, and also makes it harder to add more static elements at the
end of the navbar, but this block should be acceptable for now.

One alternate would be a "grow-1" class or similar but we might need
to think that through.
2020-07-13 15:39:36 -07:00
Gittenburg 53c66fd9c4 message_header: Fix date alignment in PMs.
My previous message_header fix
0b4568d249
accidentally changed the alignment of dates in private messages (so that
it was inconsistent to the alignment in other narrows).
2020-07-13 13:26:54 -07:00
Aman Agrawal 46c966576d scss: Fix broken rules. 2020-07-13 10:46:34 +05:30
Gittenburg 0b4568d249 message_header: Fix overlap on mobile with flex.
Previously .recipient_row_date was positioned absolutely, allowing it to
overlap with the topic name on narrow screens. This can be solved by
using flexbox. To implement the empty space between the bar controls and
the date on wider screens we move the date outside of the bar controls
(which also makes more sense semantically since the date isn't a
control).

Fixes #15501.
2020-07-09 13:13:38 -07:00
Aman Agrawal 18bebbf290 recent_topics: Set correct container as scrolling container.
This fixes the bug of extra topics not being rendered on scrolling.
list_render uses `max-height` to determine which container is being
scrolled upon. Set the `max-height` on the scrolling container of
recent topics to help list_render identify it.
2020-07-08 17:51:27 -07:00
Gittenburg 5bb10036b5 emoji_picker: Allow selecting multiple while holding Shift.
We detect shift with event.shiftKey so we need to pass the event around.

Fixes #8465.
2020-07-08 13:25:49 -07:00
Rohitt Vashishtha 912e372c4e markdown: Remove !avatar() and !gravatar() syntax.
This particular commit has been a long time coming. For reference,
!avatar(email) was an undocumented syntax that simply rendered an
inline 50px avatar for a user in a message, essentially allowing
you to create a user pill like:

`!avatar(alice@example.com) Alice: hey!`

---

Reimplementation

If we decide to reimplement this or a similar feature in the future,
we could use something like `<avatar:userid>` syntax which is more
in line with creating links in markdown. Even then, it would not be
a good idea to add this instead of supporting inline images directly.

Since any usecases of such a syntax are in automation, we do not need
to make it userfriendly and something like the following is a better
implementation that doesn't need a custom syntax:

`![avatar for Alice](/avatar/1234?s=50) Alice: hey!`

---

History

We initially added this syntax back in 2012 and it was 'deprecated'
from the get go. Here's what the original commit had to say about
the new syntax:

> We'll use this internally for the commit bot.  We might eventually
> disable it for external users.

We eventually did start using this for our github integrations in 2013
but since then, those integrations have been neglected in favor of
our GitHub webhooks which do not use this syntax.

When we copied `!gravatar` to add the `!avatar` syntax, we also noted
that we want to deprecate the `!gravatar` syntax entirely - in 2013!

Since then, we haven't advertised either of these syntaxes anywhere
in our docs, and the only two places where this syntax remains is
our game bots that could easily do without these, and the git commit
integration that we have deprecated anyway.

We do not have any evidence of someone asking about this syntax on
chat.zulip.org when developing an integration and rightfully so- only
the people who work on Zulip (and specifically, markdown) are likely
to stumble upon it and try it out.

This is also the only peice of code due to which we had to look up
emails -> userid mapping in our backend markdown. By removing this,
we entirely remove the backend markdown's dependency on user emails
to render messages.

---

Relevant commits:

- Oct 2012, Initial commit        c31462c278
- Nov 2013, Update commit bot     968c393826
- Nov 2013, Add avatar syntax     761c0a0266
- Sep 2017, Avoid email use       c3032a7fe8
- Apr 2019, Remove from webhook   674fcfcce1
2020-07-07 10:39:44 -07:00
Aman Agrawal c947be5411 msg_edit_form: Show checkboxes in separate lines if present. 2020-07-06 12:38:58 -07:00
jagansivam28 9164247733 settings CSS: Remove unwanted CSS in `settings.scss`.
When we extract common HTML template (`image_upload_widget.hbs` )
for user avatar, realm day/night logo and  realm icon widget's
lot of new CSS are created to match image_upload_widget.hbs and
old CSS are preserved in `settings.scss`. This commit removes all
unwanted or unused CSS in `settings.scss`.
2020-07-03 17:32:28 -07:00
Gittenburg 3a973b15ee settings: Fix modal out of screen on mobile.
For the email and full name modals we simply change width to max-width.

The password modal used a flex-row class for no apparent reason,
the class wasn't used anywhere else and removing it fixes the UI bug.

Fixes #15311.
2020-07-02 13:47:26 -07:00
Vishnu KS 4c6350fa4b billing: Add option to request a sponsorship in /upgrade. 2020-07-01 16:45:38 -07:00
SiddharthVarshney aefd8f0de2 navbar: Fix UI bugs in right column of nav header.
Fixes the click target for the gear icon by providing
a proper rectangular area around it.

Minor UI adjustments of gear icon and expanded
navbar-search for small size devices.

Fixes: #15222.
2020-06-30 16:51:55 -07:00
jagansivam28 9258f54aea CSS: Extract image_upload_widget.scss with all related upload widget CSS.
Since we had extracted `image_upload_widget.hbs` HTML for
image upload widget's like user avatar, realm logo, realm icon
we can also extract  `image_upload_widget.scss` SCSS file
from settings.scss file with all the CSS related
to image upload widget's.
This change will also help us to keep `settings.scss` cleaner.
2020-06-30 10:16:33 -07:00
Aman Agrawal d2a6d0dfda recent_topics: Move launch button to top left sidebar.
Make dispaly `a` tag a block to so that it is clickable on
anywhere in the button space.
2020-06-29 22:21:23 -07:00
orientor 5629dcc8a6 openapi_docs: Display deprecated parameters with a `deprecated` tag.
In zulip.yaml, add `deprecated` tags to all parameters/keys with
`Deprecated` in the description. Then add tests to ensure that deprecated
parameters/keys will always have the `deprecated` key. Also, in
the API docs, sort the parameters according to presence of `deprecated`
key, presenting the `deprecated` keys at the end and add a `deprecated`
tag next to them.
2020-06-26 16:05:41 -07:00
Gittenburg 2fe8d7507d settings: Fix media-query edge case.
If your browser width was between 701px and 750px you got the mobile
view without the mobile header preventing you from changing sections in
the settings menu.

This was caused by a media-query mismatch:

subscriptions.scss used @media (max-width: 750px)
settings.scss however used @media (max-width: 700px)

Comments added by tabbott to help avoid future bugs like this.
2020-06-25 11:08:40 -07:00
Gittenburg 5d279d5456 settings: Fix bugged navigation on mobile.
* Don't annoyingly open the first section when switching
  between the Settings and Organization tabs.

* Don't highlight currently active section in the settings list
  (we don't display the currently active section in the mobile settings
  list so it isn't actually active).

* Remove nearly invisible and buggy no-border logic.
2020-06-25 11:08:13 -07:00
Aman Agrawal fc31eaa356 recent_topics: Show a line below the focused element. 2020-06-24 15:37:46 -07:00
Aman Agrawal 4cd7f2a329 recent_topics: Wrap focusable elements around a div.
This avoids hard coding the focusable elements.
2020-06-24 15:33:25 -07:00
Tim Abbott 148f74d3a7 css: Move night theme pygments CSS to night_mode.scss.
The previous architecture did not work properly with the automatically
detected night theme, resulting in a weird mix of the night and day
themes on code blocks.

I'm not thrilled with the requirement this imposes that all of our
night theme CSS needs to be in one file, but we do need to get a quick
fix out here.

Fixes #15554.
2020-06-24 12:35:02 -07:00
Ryan Rehman 1e0340e0a3 css: Allow cross icon to stay at end of searchbox.
Fixes #10026.
2020-06-23 17:25:45 -07:00
Tim Abbott 4f7848d9b2 css: Fix starred messages not being displayed.
This change was missed in a4f5b0c635.

Ideally, we'd figure out a refactoring that made these definitions
only appear in one place.
2020-06-23 17:22:16 -07:00
jagansivam28 eaa085a6f8 realm logo: Add title for realm day/night logo.
Having title for realm day/night logo elements is
pretty good so that we can reduce confusion for new users.
2020-06-23 14:24:56 -07:00
jagansivam28 762f6c6cbc realm logo: Move day/night logo elements to allow them being alongside.
Previously in desktop view, the realm day/night logo element is arranged
one by one which is not looking good since we have a lot of space on the
the right side of the logo elements so we can move day/night logo elements
to allow them being alongside.

In mobile view, we don't have any space on the right side of the logo
elements so we don't have to change anything.
2020-06-23 14:24:56 -07:00
Anders Kaseorg 978f25d4ac styles: Use @supports for Mozilla detection.
Fixes these compilation errors from webpack and PostCSS, exposed by
commit b10f156250 (#14997) which tries
to @extend these directives:

Unexpected '}' at app.d5da4b9d46e79634b8fb.css:9103:4.
Unexpected '}' at app.d5da4b9d46e79634b8fb.css:9104:0.
Invalid property name '@-moz-document url-prefix() {

            @nest & #settings_page select {
        background-color' at night_mode.scss:788:0. Ignoring.
Invalid selector '}
}

.user_status_overlay .overlay-content' at night_mode.scss:797:4. Ignoring.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-06-22 18:11:28 -07:00
Aman Agrawal ae43ef5959 recent_topics: Make avatars bigger and borderless.
Set vertical alignment of contents in middle of row.
2020-06-22 12:56:19 -07:00
Gittenburg af867cb26c recent_topics: Fix buggy scrolling.
The knob of the scroll bar scrolled out of view in both Firefox and
Chromium and on Firefox it even cut off the last entry.

Fixes #15511.
2020-06-22 12:20:43 -07:00
YashRE42 a4f5b0c635 message_controls: Prevent clicks via visibility & not pointer-events.
Previously, the message controls had a bug where they would trigger on
mobile with a single tap over the area they occupy when visible. This
is wrong because a user would expect to first see the controls and
only trigger them once they are visible (with a second tap).

The above bug is caused by the fact that we were using "opacity: 0" on
".message_controls > div" to hide the controls and "opacity: 1" on
".messagebox &:hover .message_controls > div" to show the controls on
hover, however, this would not effect the click action because
"opacity". So we used "pointer-events: none;" and "pointer-events:
all;" with the hopes that it would prevented the above bug, but in
practice, it didn't.
(the most probable explanation being that tapping the message_control
area would cause the "&:hover" rule to trigger and change the
"pointer-event" to "all" before it could prevent the click trigger,
But that explanation is just conjecture.)

This commit replaces both "pointer-events" attributes with
"visibility: hidden" and "visibility: visible" respectively. The
result being that the message_controls behave identically to before,
except without the above bug.

The addition to the ".has_actions_popover .info" selector is important
because without it, we would regress on issue #3172.

Trivia:
An alternate approach to using "opacity" is to set the
"display" attribute to "none", however, using "display" prevents the
transition from animating (which is probably why we were using opacity
here in the first place). "visibility" does not prevent the transition
from animating.

History: The "pointer-events" attribute was introduced in
4d5aa3ddc9 and it replaced prior code
which relied on the "visibility" attribute... But it seems PR #3792
was mostly focused on improving the positioning through removal of
`display: none`, but introduced opacity to make the animations work
rather than visibility as the replacement solution, which requires the
pointer-events hack and resulted in the bug described here.

Fixes the second bug described in #13642.
2020-06-21 10:12:41 -07:00
MariaGkoulta b10f156250 settings: Add automatic theme detection feature.
With this implementation of the feature of the automatic theme
detection, we make the following changes in the backend, frontend and
documentation.

This replaces the previous night_mode boolean with an enum, with the
default value being to use the prefers-color-scheme feature of the
operating system to determine which theme to use.

Fixes: #14451.

Co-authored-by: @kPerikou <44238834+kPerikou@users.noreply.github.com>
2020-06-21 01:09:01 -07:00
SiddharthVarshney 1a8e9d1164 user-profile: Change color of `name` field.
With the previous color it was hard to read the text and
also that color does not matches with the zulip style.

This commit changes the color of `name` field for
user-profile modal for better visability both in day
and night mode.
2020-06-20 23:32:49 -07:00
SiddharthVarshney 3e1a0c0e32 portico: Fix UI of /accounts/go page.
Fixes: #14809
2020-06-20 17:54:06 -07:00
SiddharthVarshney 92059a5379 css: Use SCSS nesting for `.portico-landing.hello .gradients .gradient`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 5f8b8d62b9 css: Use SCSS nesting for `.portico-landing.hello .hero`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney c3847c9b30 css: Use SCSS nesting for `.portico-landing.hello .hero header`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 0453c0bc36 css: Use SCSS nesting for `.portico-landing.hello .hero header button`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 5a02fd4a6b css: Use SCSS nesting for `.portico-landing.hello .hero .content`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney cabdc72722 css: Use SCSS nesting for `.portico-landing.hello .hero .waves`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 45ea511225 css: Use SCSS nesting for `.portico-landing.hello .hero .waves .wave`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney f96e38a8bd css: Reorder css for `.portico-landing.hello .hero`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney be8027cb54 css: Use SCSS nesting for `.portico-landing.features-app`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney ce9a365c62 css: Use SCSS nesting for `.portico-landing.features-app .feature-block`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney d8a3ca0b2e css: Use SCSS nesting for `.portico-landing.features-app .cta`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney c37d83347c css: Use SCSS nesting for `.portico-landing.features-app .cta:hover`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 7ea662e035 css: Use SCSS nesting for `.portico-landing.features-app section`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney b3db95e879 css: Use SCSS nesting for `.portico-landing.features-app section a`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 544622a435 css: Use SCSS nesting for `.portico-landing.features-app section a.feature-block`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 553c3f1a50 css: Use SCSS nesting for `.portico-landing.features-app section .headliner`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 17ddbf33b1 css: Use SCSS nesting for `.portico-landing.features-app section.notifications`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney acfd7755bb css: Use SCSS nesting for `.portico-landing.features-app section.notifications .feature-list`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney b19902e00c css: Use SCSS nesting for `.portico-landing.features-app section.notifications .feature-list h3`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 88c2dfa580 css: Merge css for `.portico-landing.features-app section.notifications`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 6ec11e549d css: Use SCSS nesting for `.portico-landing.features-app section.messages`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney ea1d2688c8 css: Use SCSS nesting for `.portico-landing.features-app section.messages .features`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 9a7c6504bb css: Use SCSS nesting for `.portico-landing.features-app section.keyboard-shortcuts`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 621dd2a445 css: Use SCSS nesting for `.portico-landing.features-app section.keyboard-shortcuts img`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 00eb90a551 css: Use SCSS nesting for `.portico-landing.features-app section.hero`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney 68268c8c1e css: Use SCSS nesting for `portico-landing.show`. 2020-06-20 17:46:08 -07:00
SiddharthVarshney d61fd5d9eb css: Reorder `.portico-landing` and `.portico-landing.show`. 2020-06-20 17:46:08 -07:00
arpit551 0c6488b284 analytics: Added frontend for messages read over time graph.
The chart added is similar to the messages sent over time chart.

Fixes #15167
2020-06-20 16:52:33 -07:00
SiddharthVarshney e763d30f18 help: Update help docs for ellipsis.
Update help docs where chevron was previously
mentioned for sidebar manu icons.

Add css for `i.zulip-icon` to position icon
properly.
2020-06-20 16:47:43 -07:00
SiddharthVarshney b122ad7da4 topic-popover: Add chevron-right icon in topic popover title. 2020-06-20 14:57:54 -07:00
Ryan Rehman aa82008503 search pills: Fix pills misalignment bugs visible in firefox.
The `.search_icon` lies inside the `.pill_container` so we had to
remove it's display attribute which should have no visual changes.

We add `flex-wrap: nowrap` to prevent the cursor from moving onto
a new line, below the pills.

Fixes #15480.
2020-06-20 14:50:56 -07:00
jagansivam28 9038c7f28f settings CSS : Fix 'user-avatar-source' text reflow bug.
When we move the avatar upload widget to `image_upload_widget.hbs` file
the CSS `position:absolute` for `avatar-source` is preserved.
by removing CSS `position:absolute` we can fix the bug.
2020-06-19 15:53:51 -07:00
Rohitt Vashishtha c3bfa3de0d timestamp: Update night mode css after the syntax change. 2020-06-19 13:07:16 -07:00
Tim Abbott 9173f32a10 api docs: Fix formatting in changelog.
The CSS changes prevent our API docs markdown processor from
preserving line breaks within inline code block content.
2020-06-18 22:38:05 -07:00
Siddharth Varshney bbb07aed38 portico: Add hint text for invite only realm on /login.
Fixes: #10542

This will make obvious for users what to do when they are not able to login.

Test added by hackerkid.
2020-06-18 17:23:11 -07:00
sahil839 d9b7228444 streams: Add frontend to set/update message_retention_days of a stream.
This commit adds frontend support for setting and updating message
retention days of a stream from stream settings.

Message retention days can be changed from stream privacy modal of the
stream and can be set from stream_creation_form while creating streams.

Only admins can create streams with message_retention_days value other
than realm_default.

This commit also contains relevant changes to docs.
2020-06-18 17:00:34 -07:00
Rohitt Vashishtha 6ea3816fa6 markdown: Use html5 <time> tag for timestamps.
Previously, we had implemented:
    <span class="timestamp" data-timestamp="unix time">Original text</span>
The new syntax is:
    <time timestamp="ISO 8601 string">Original text</time>
    <span class="timestamp-error">Invalid time format: Original text</span>

Since python and JS interpretations of the ISO format are very
slightly different, we force both of them to drop milliseconds
and use 'Z' instead of '+00:00' to represent that the string is
in UTC. The resultant strings look like: 2011-04-11T10:20:30Z.

Fixes #15431.
2020-06-18 14:11:33 -07:00
Dinesh 9801692a2d css: Fix size of GitLab icon in login and signup buttons. 2020-06-18 13:06:10 -07:00
Dinesh 0445311430 auth: Make apple log in and sign up buttons consistent with others. 2020-06-18 13:06:10 -07:00
sahil839 8bd1429f4c css: Move css of upgrade-tip class to app_components.scss.
This commits moves the css of upgrade-tip class from settings.scss
to app_components.scss as this class will also be used in stream
settings page for message-retention-days setting in further commits.

tip class in settings.scss is also moved as it has the same styles as
upgrade-tip class.
2020-06-18 01:17:58 -07:00
SiddharthVarshney 20f7e6a393 left-sidebar: Update comment.
Since chevron is replaced with ellipsis this
commit will update the comment.
2020-06-18 00:54:18 -07:00
jagansivam28 548107632c settings org: Use `image_upload_widget.hbs` for realm day/night logo.
Now we can use common HTML image upload widget template
`image_upload_widget.hbs` for realm day/night logo and
we should access those day/night logo elements using
e.g., "#realm-day/night-logo-upload-widget .realm-logo-elements".
since we use image_upload_widget.hbs for realm day/night logo upload
widget we need to extract CSS for realm day/night logo and
place them separately under `#realm-day-logo-upload-widget`
and `#realm-day-logo-upload-widget` css id.
2020-06-17 17:47:49 -07:00
jagansivam28 e132db3480 settings org: Use `image_upload_widget.hbs` for realm icon.
Now we can use common HTML image upload widget template
`image_upload_widget.hbs` for realm icon. we can access icon
element using "#realm-icon-upload-widget .realm-icon-elements".
also we need to extract CSS for realm icon and place them
separately under `#realm-icon-upload-widget` css id.
2020-06-17 17:47:49 -07:00
YashRE42 c3d322f1a7 navbar: Improve spacing between stream name and sub_count. 2020-06-16 17:26:55 -07:00
YashRE42 63f69c48a5 navbar: Fix clickable area between sub_count and narrow_description.
Previously, there was a small dead spot in the click area between the
sub_count and narrow_description, such that the mouse cursor would
switch from pointer to the default.

This commit corrects the dead spot by adjusting the margins and styles
on navbar elements.

This should be workable, but there is scope for improvement especially
given that the current margins and paddings are messy and not very
semantic.

The end result is that the entire navbar becomes a smooth, clickable
region.
2020-06-16 17:26:55 -07:00
YashRE42 71e393575b navbar: Improve click area around stream name.
Previously the click area to open the settings modal was limited to
just the stream name (just the text). This, inconveniently, created a
lot of empty, unclickable space around the stream name.

This commit resolves the problem by:
  * Extracting the title and icon into a separate template as
    `navbar_title_and_icon.hbs` and calls this partial in
    `tab_bar.hbs`.
  * Calling the partial within an <a> tag for stream based narrows
    and in a <span> tag for non-stream narrows.
  * Making some CSS changes so that everything still renders correctly
    (visually).

This commit also:
  * Leads us to "piggy back" all stream based narrow elements on the
    `stream_settings_link` conditional. (Previously the only "piggy
    backing" was by `narrow_description` on `sub_count`, which was
    necessary for the rendering of the `(no description)` string.)

The end goal here is that the entire navbar is clickable. This is a
step towards that goal, but some of the margins on the sub count and
its ::before and ::after pseudo-elements still need to be fixed.
2020-06-16 17:26:55 -07:00
YashRE42 846383f4a0 navbar: Set user count region as click target to open settings modal.
Previously the click area to open the settings modal was limited to
just the stream name (just the text).

A nice goal to strive for here is to make the entire navbar a
continuous clickable region.

This adds the same click action as `stream_name` to the `sub_count`.

There's still scope for improvement after this change because of the
margins on `sub_count::before` and `sub_count::after` as well as
because only the text in `stream_name` is clickable.
2020-06-16 17:26:55 -07:00
YashRE42 94746977ad refactor: Extract pseudoclass based tags out of span in tab_bar.
Currently the styles for the navbar are in a confusing and ugly state.

One of the problems is that we have several styles within the `span`
including some nested pseudotag selectors within the `span`.
This is bad because it gives semantic meaning to the `span` element
which we do not intend. We should remove as many styles which intend
to target "direct children" instead of "direct children that are
spans" and (iff there are styles for the later) then substitute the
"span" for a semantically meaningful class name.

Another problem here is that these pseudotag based selectors aren't
very clear and readable, which is something we can look into
correcting now that they are separate from the `span` tag.

This is a prep commit that aims to set us on the path for further
improvements. It also enables us to switch some tags around and allows
us to use the styles in the `span` block with other selectors via `,`.
This should make no visual or behavioral changes.
2020-06-16 17:26:55 -07:00
Clara Dantas ddbde66af5 realm: Remove Google Hangouts integration.
Google  has removed the Google Hangouts brand, thus we are removing
them as video chat provider option.
This commit removes Google Hangouts integration and make a migration
that sets all realms that are using Hangouts as their video chat
provider to the default, jitsi.

With changes by tabbott to improve the overall video call documentation.

Fixes: #15298.
2020-06-16 17:02:27 -07:00
Sara Gulotta 1cb040647b markdown: Add support for spoilers.
This adds support for a "spoiler" syntax in Zulip's markdown, which
can be used to hide content that one doesn't want to be immediately
visible without a click.

We use our own spoiler block syntax inspired by Zulip's existing quote
and math block markdown extensions, rather than requiring a token on
every line, as is present in some other markdown spoiler
implementations.

Fixes #5802.

Co-authored-by: Dylan Nugent <dylnuge@gmail.com>
2020-06-16 16:14:10 -07:00
jagansivam28 4fe066c437 user avatar: Remove `image-block` id.
Now we can remove `user-avatar-block` id and add common class `image_block`.
we can access this class using `#user-avatar-upload-widget .image_block`
so that we can have only one id at top-level and 'image_upload_widget.hbs`
can be more dynamic so we can use for other similar widgets also.
2020-06-16 12:12:21 -07:00
jagansivam28 9fde085536 user avatar: Remove `avatar-spinner-background` id.
Now we can remove the id `avatar-spinner-background` and access spinner
element from `#user-avatar-upload-widget .image_upload_spinner` so
that we can have only one id at top-level and 'image_upload_widget.hbs` can
be more dynamic so we can use for other similar widgets also.
2020-06-16 12:12:21 -07:00
jagansivam28 0e5c6fa578 user avatar: Remove `user_avatar_upload_button` id.
The upload text element is wrongly named as id=user_avatar_upload_button.
now  we can remove that id and access upload text element from
`#user-avatar-upload-widget .settings-page-upload-text` so that we
can have only one id at top-level  and 'image_upload_widget.hbs` can
be more dynamic so we can use for other similar widgets also.
2020-06-16 12:12:21 -07:00
jagansivam28 df4c8ab1a2 user avatar: Remove `user_avatar_delete` id.
We can remove id="user_avatar_delete" and access delete-text from
`#user-avatar-upload-widget .settings-page-delete-text` so that
we can have only one id at top-level  and 'image_upload_widget.hbs`
can be more dynamic so we can use for other similar widgets also.
2020-06-16 12:12:21 -07:00
jagansivam28 b3fca96254 user avatar: Remove user_avatar_delete_button id.
we can remove `user_avatar_delete_button` id and access delete button
from `#user-avatar-upload-widget .settings-page-delete-button` so that
we can have only one id at top level and 'image_upload_widget.hbs`
can be more dynamic so we can use for other similar widgets also.
2020-06-16 12:12:21 -07:00
jagansivam28 95de217326 user avatar: Rename and convert "#user-settings-avatar".
Renaming "user-settings-avatar" to "image_upload_button" since the
`user-settings-avatar` name is irrelevant/confusing for the upload
button, and converting the id into a class so that we could just have
only one outer id.
2020-06-16 12:12:21 -07:00
jagansivam28 14a77c8b9a settings: Refactor `image_upload_widget.hbs`.
We can check for the `is_editable_by_current_user` condition once in
the upper level instead of checking twice in middle for the same
conditions and to match the implementation of style realm icon and
realm logo since similar implementation between avatar, logo, the icon
will help us to use `image_upload_widget.hbs` for logo and icon
widgets also.

This likely fixes a bug with the delete text being shown incorrectly
for non-administrator users.
2020-06-16 12:12:21 -07:00
jagansivam28 19490fe8b0 settings: Change user avatar image display HTML.
This changes the user avatar image display implementation to more
closely match how the realm icon and realm logo image features are
structured.  This is early preparatory work towards sharing this code
between the various widgets.
2020-06-16 12:03:50 -07:00
SiddharthVarshney 177ec5b2d5 sidebars: Replace chevron with ellipsis-v icon from the sidebars.
The chevron sometime can be confused as an icon for expanding the
stream topics especially for the new users.

This commit replaces the confusing chevron icon from the stream-sidebar,
topic-list, user-presence-row, all-messages and starred-messages with
ellipsis-v icon(vertical three dots).

Fixes: #7115
2020-06-14 20:57:43 -07:00
Siddharth Varshney 5b940fc1b8 ui: Fix stream filter top margin in left-sidebar.
Because of the negative margin in `#stream_filters` the
`STREAMS` header was slighty overlapping the first
stream filter resulting sharp border.
2020-06-14 16:09:33 -07:00
Siddharth Varshney b7100d8293 ui: Fix simplebar position in the left-sidebar.
The left simplebar sometime interferes with the
chevrons on the stream filters.

This commit reduces the width of active stream filter
by adding margin-right and hence fixes the overlap of
the simplebar over the active filters
2020-06-14 16:09:33 -07:00
SiddharthVarshney 8636d82eba settings: Use icon to play notification sound. 2020-06-13 16:46:05 -07:00
Aman Agrawal 0327ec4c4b recent_topics: Show unread counts similar to other UI elements. 2020-06-13 16:29:19 -07:00
Aman Agrawal a1cca4544c recent_topics: Improve variable naming of tableFixHead. 2020-06-13 16:29:19 -07:00
Aman Agrawal 4aeb02f73d stream_header_colorblock: Create resuable css class.
stream-selection-header-colorblock css class can now be used
to reproduce stream header color block everywhere.
2020-06-13 15:38:40 -07:00
SiddharthVarshney b82ca432bb right-sidebar: Fix the height of user presence list elements.
This will adjust the height of user presence list elements to
match with the left-sidebar list elements i.e. 23px.

Extra margin is removed to avoid increase in too much spacing
between elements.
2020-06-11 17:14:09 -07:00
SiddharthVarshney 46a98d2eec right-sidebar: Fix menu icon hover color.
This will fix the menu icon hover effect for the day mode.
2020-06-11 17:14:09 -07:00
Vinit Singh 8b2098f34d refactor: Add css nesting to #out-of-view-notification. 2020-06-10 17:00:39 -07:00
Aman Agrawal 7585776c76 stream_header: Fix broken header color and outflowing boundary.
The stream header was moved below the selection option and the
boundary selection input was overflowing, both were fixed via
this commit.
2020-06-10 09:50:49 -07:00
Aman Agrawal ec00e39e45 recent_topics: Fix misplaced thead border and adjacent css properties. 2020-06-09 22:08:31 -07:00
Aman Agrawal e5e02319b4 recent_topics: Show msg if no topics are visible. 2020-06-09 22:08:31 -07:00
Aman Agrawal ad2e7026c8 recent_topics: Add functionality to sort rows via header.
Add custom sorting for stream and topic headers.
2020-06-09 22:08:31 -07:00
Aman Agrawal 33ace41ffe recent_topics: Add filter button to show muted topics.
We don't show muted streams/topics by defualt. Only when user
turns on muted filter.
2020-06-09 22:08:31 -07:00
Aman Agrawal 89fe133d2d recent_topics: Add button to clear search. 2020-06-09 22:08:31 -07:00
Aman Agrawal 272a3eed8a recent_topics: Show unread count after topic name.
We remove the non-obvious unread count column and move the unread
counts to be displayed after topic.
2020-06-09 22:08:31 -07:00
Aman Agrawal d8a312eddb recent_topics: Append proper prefix before stream name.
We reuse the existing logic for displaying and updating stream color
from the stream left sidebar.

Tests fixtures were extracted and updated for this commit.
2020-06-09 22:08:31 -07:00
Aman Agrawal ee7faf13cc recent_topics: Show checkbox icons for active filters. 2020-06-09 22:08:31 -07:00
Aman Agrawal cea3bb437f recent_topics: Make table headers fixed. 2020-06-09 22:08:31 -07:00
Aman Agrawal 4f1b7542ed recent_topics: Toggle topic display according to filters. 2020-06-09 22:08:31 -07:00
Aman Agrawal bc7136590a recent_topics: Add avatars of recent senders to topic. 2020-06-09 22:08:31 -07:00
Aman Agrawal bdaf4e1079 recent_topics: Add action to mark topic as read. 2020-06-09 22:08:31 -07:00
Aman Agrawal 464b541363 recent_topics: Display recent topics in a table.
* Add action to mute topics.
* We don't need to store muted data per topic as previously planned.
* Moved launch topic test to the top so that they run on non-modified
  data.
2020-06-09 22:08:31 -07:00
Aman Agrawal 9328dc8437 templates: Show Overlay of Recent Topics.
* Show an empty overlay of recent topics.
* Register click event to open recent topics.
* Launch recent topics on "t" keypress.

This is based on the draft overlay.
2020-06-09 22:08:31 -07:00
Aman Agrawal 56b1b6c067 navbar: Add recent topics button.
This commit is kept separate so that we can easily move the
place where the recent topic button should be finally kept.
2020-06-09 22:08:31 -07:00
Dinesh dc90d54b08 auth: Add Sign in with Apple support.
This implementation overrides some of PSA's internal backend
functions to handle `state` value with redis as the standard
way doesn't work because of apple sending required details
in the form of POST request.

Includes a mixin test class that'll be useful for testing
Native auth flow.

Thanks to Mateusz Mandera for the idea of using redis and
other important work on this.

Documentation rewritten by tabbott.

Co-authored-by: Mateusz Mandera <mateusz.mandera@zulip.com>
2020-06-09 17:29:35 -07:00
YashRE42 43bf6a0b1a search box: Align the search exit button for pills and legacy.
This commit aligns the search icon in the navbar (with the search bar
closed) to be in the same position as the "search_exit" or "x" icon
(which appears when the search bar is open).
2020-06-09 14:49:38 -07:00
YashRE42 716a39fcb5 search_box: Fix search bar background on nightmode.
Commit c4e59309e4 introduced a
regression that caused a small part of the navbar in night mode to not
have the correct background color.

The relevant changes in that commit intended to fix the margin for the
search box for when the search pills feature was set to active.

This commit slightly increases the padding for the search box (when
pills are active), to improve pill alignment, and adds styles for
"#searchbox_legacy" to correct the background when search pills are
disabled.

This also reverts the change from commit
29b8e11e20 which tried to improve the
alignment of pills by adding a margin left but didn't address the
background color issue.
2020-06-09 14:49:38 -07:00
jagansivam28 627666b57c settings org: Trigger realm logo upload by clicking on logo element.
We now trigger realm day/night logo upload by clicking on realm
day/night logo element itself rather than having a big upload button
and to match our user avatar UI.  Added new spinner over the logo
element itself to show while uploading realm logo for both day and
night logos.
2020-06-08 22:54:46 -07:00
jagansivam28 923f6b40c5 settings org: Replace realm logo delete button with X icon.
Replacing delete button for `realm day/night logo` with "X" icon in the
right corner of the logo image to match "user profile" avatar UI.
2020-06-08 22:54:46 -07:00
jagansivam28 500dc37d46 realm logo: Display logo full width regardless of the size of the image.
Display logo at full width regardless of the size of the image to
reduce the dependency on the logo image in determining the logo
container size.  This also fixes a problem owhere the night/day logos
would lose their default-dark/white background color when we upload an
image in jpg format rather than png.
2020-06-08 22:54:07 -07:00
jagansivam28 adb1f56760 settings: Change user avatar spinner implementation.
Change user avatar spinner implementation to match
realm icon spinner implementation and have common css class
since similar implementation between similar widgets may help
in future deduplication.
2020-06-08 22:48:04 -07:00
jagansivam28 5f027f194b settings CSS: Refactor upload text css to use common css class.
Refactor user avatar and realm icon upload-text css
to use common CSS Class.
2020-06-08 22:48:04 -07:00
jagansivam28 a9b0c03a0d settings CSS: Refactor delete button, text css to use common css class.
Refactor user avatar and realm icon delete-button, delete-text CSS
to use common CSS Class.
2020-06-08 22:48:04 -07:00
majordwarf 897f1e9e3d css: Merge css ruleset in `right-sidebar.scss` for `#userlist-header`. 2020-06-08 16:27:36 -07:00
majordwarf 6a842579b2 css: Use SCSS nesting in `right-sidebar.scss` for `.user_sidebar_entry`. 2020-06-08 16:27:36 -07:00
majordwarf 0692cd1379 css: Use SCSS nesting and merge css rulesets for `#user_presences`. 2020-06-08 16:27:36 -07:00
majordwarf 869dad4f9e css: Reorder right-sidebar.scss to put `#user_presences` alongside. 2020-06-08 16:27:36 -07:00
majordwarf a27e908cae css: Use SCSS nesting in `right-sidebar.scss` for `.right-sidebar`. 2020-06-08 16:27:36 -07:00
Sharif Naas 5065ae3637 css: Remove redundant declaration from night mode CSS.
This declaration already exists in the default CSS.

This declaration was present when the edit history modal was first
given a night mode (then called "dark mode") style in November 2017 in
4f81bdd0a6. It also existed in the
default CSS at that time.
2020-06-07 13:57:28 -07:00
Sharif Naas b148c8dbd6 edit_history: Highlight topic edit diffs by using correct CSS selector.
Previously, topic edit diffs in the edit history modal were not
highlighted in the same way as content diffs because the highlighting
CSS rules were inside a .rendered_markdown block. So they affected the
content diffs, which are classed as such, but not the topic diffs.

This commit moves the highlight rules to a
.message_edit_history_content block inside the already existing
 #message-edit-history block. .message_edit_history_content had
already existed in the edit history template message_edit_history.hbs,
and is assigned to both the content and topic diffs.

The ability to see topic edits in the edit history was added in
March 2019 in 38be5ea74394d2fd8586038de6ac447b4bbfbf67; the
highlighting worked at that time. It broke four mounths later in July
2019 in 38ffde37e5 when the highlight
rules were moved into a .rendered_markdown block after having been
global.

(As a further aside, .rendered_markdown was only added to the content
diffs in April 2019 in 5c36918c17.
.message_edit_history_content had been first added, to the content
diffs, in February 2019 in 7d42d7b4dbe6eb144a148135db50ad35efc01295.)

Aside from fixing topic edit diffs, this change is just more correct;
the highlight rules don't belong under .rendered_markdown, and they
don't need to be applied globally.
2020-06-07 13:57:28 -07:00
Sharif Naas 78691b13ad css: Extract message_edit_history.scss.
Note that the .rendered_markdown selector is incorrect, and will be
fixed in a following commit.
2020-06-07 13:57:28 -07:00
SiddharthVarshney b22b1004a8 user-profile: Fix user profile layout for long name. 2020-06-07 12:55:43 -07:00
SiddharthVarshney d09758cec3 profile_setting: Enable allowInput on flatpickr.
Without this field the datepicker was in readonly mode.
2020-06-07 11:03:48 -07:00
Aman Agrawal a096f34cab move_topic_to_stream: Add option to disable breadcrumb messages.
Option to disable breadcrumb messages were given in both message edit
form and topic edit stream popover.

User now has the option to select which stream to send the notification
of stream edit of a topic via checkboxes in the UI.
2020-06-05 12:28:51 -07:00
Wyatt Hoodes 3bce7bbc74 userlist-toggle: Fix css styling errors. 2020-06-05 10:56:33 -07:00
Wyatt Hoodes 5fe489c5ae dropdown-menu: Remove caret-down icon and fix alignment.
The alignment on narrow windows is also off.  We fix
this spacing issue while we're at it.
2020-06-05 10:56:33 -07:00
Aman Agrawal c276bcd6af stream_header_colorblock: Combine compose and msg_edit css blocks.
Remove unused properties and fix border in message edit colorblock.
2020-06-05 09:39:00 -07:00
YashRE42 f9414c2ea5 search pills: Fix nightmode color of sub counts & narrow description. 2020-06-05 09:37:29 -07:00
majordwarf 29b8e11e20 navbar: Fix search input margin.
The commit fixes the spacing between the search icon and the input
field by adding `margin-left` to the search input field. The following
issue is only visible in dark mode as the nav and search input have
different background color while normal theme uses same background color
for nav and search input.
2020-06-04 14:28:00 -07:00
Rohitt Vashishtha d870118f8f overlay: Mitigate issue with dropdown list widget getting clipped.
This isn't a complete fix, but we move the widget's popup to be
on/below the button to open the widget. We also move the bot owner
field to be on the top of the page so that we can see most of the
widget before it is clipped by the parent overlay.

We have discussed some approaches for a permanent fix on:

https://chat.zulip.org/#narrow/stream/321-s/topic/DropdownListWidget/near/894674
2020-06-04 16:44:19 -04:00