The order in the streams section is visual, audio, mobile, email, which also
seems to match other products (though didn't do a careful analysis). This
changes the PM section to match.
Previously the selector returned an undefined element when trying to select
the message edit save button (since `closest` selects the closest parent in
the DOM tree). This is fixed in this commit.
A few bugs were caused by 7d4cebbc1e.
In night mode:
- home icon was hidden by grey box on "All messages" narrow.
- inactive tabs (eg "mentions" and "stars") were hidden behind grey box.
- topic tab was hidden behind grey box in topic narrow.
In both night mode and normal mode:
- "private messages" tab in individual/group pm narrows was illegible.
These were all results of unexpected differences in precedence rules
caused by the refactor.
Removed the preview tag from the css rule, reduced the undo preview tag
to a font-size of 15px.
The preview tag being attached to the rule proved unnecessary. The icon
for reverting back to an editing state also dipped below the horizontal
level of the icon row.
This change adds rules for ordered lists that makes them visually similar
to bulleted lists.
Note that is has no effect because our markdown implementation doesn't
currently generate ol tags.
This change decreases the spacing at the top and bottom of bulleted lists
and blockquotes.
Specific rules for p and p:last-of-type have been added for both uls and
blockquotes to maintain visually consistent spacing in all cases.
The current behavior treats uppercase and lowercase characters
differently resulting in incorrect sorting of lists.
This change fixes that and makes the alphabetic sorting of columns
case insensitive.
Apparently, our use of JavaScript string `.replace()` here was buggy,
because replace() has several special escape sequences starting with
`$` if they appear in the replacement content string. We can work
around this through something of a hack, which is to pass a function
as the second argument to replace, which seems cleaner than replacing
all $s with $$s.
Thanks to Shreya for the report.
This reverts commit 6441ad0677 since it
causes two bugs: (1) when rendering new message there is glitch where
the profile picture flashes (2) when someone sends a new message their
profile picture flickers.
Historically, we had a large bottom-margin on p tags designed to
produce correct spacing between consecutive paragraphs (10px, similar
to the spacing between consecutive paragraphs in different messages by
the same sender). And then we tried to fix the end-of-message spacing
with a p:last-of-type rule, which fixed that problem, but created lots
of unnecessary extra space just before a bulleted list, block quote, etc.
We recently added some p+ul and p+blockquote negative margin rules in
62f2396ee2 to try to fix this, but those
created some secondary issues in interaction with the p:last-pf-type
rule. This rabbit hole is likely somewhat deep.
The right fix for this overall formatting is to implement the
inter-paragraph spacing as a p+p rule, rather than a bottom-margin on
the p rule; then, we get all the properties we're interested in for
how paragraphs interact.
We may need to do some follow-up work to add small p+ul and
p+blockquote rules to get the pixel-perfect spacing we want (or maybe
just adjust the ul/blockquote spacing CSS), but this is clearly a
better architecture for doing this work.
Fixes#12101 through solving the same problem it does.
This has no functional changes, just making the implementation more
standard.
We don't have any blockquotes outside markdown rendering, which is why
it's correct to collapse the blockquote rules.
This eliminates unnecessary use of the message_content CSS class in
favor of rendered_markdown, which makes more sense for places outside
messages where we display rendered Zulip markdown.
Now that we have a scroll container for the PM list,
it doesn't make much sense to limit the number to
five.
We may resurrect this feature if "more conversations"
actually fetches more conversations, but it doesn't
currently.
We also may soon make it easy to limit PMs to just
unread messages, which will make the max-5 feature
perhaps less necessary, and we don't want to make
the UI overly complicated.
We now just calculate two vars:
pm_list - which individual PM conversation to highlight
is_pm_filter - highlight "Private messages"
The logic is structured so that we err on the side of **not**
spuriously selecting list items:
* be defensive about `filter` not existing for some reason
* don't select anything if we have multiple pm-with
operands in the search (which is sort of undefined
behavior)
Tweaked by tabbott to add a comment explaining the multiple pm-with case.
We are basically just inlining remove_expanded_private_messages,
skipping the resize call that happens at the end of rebuild_recent.
This change makes sense even if we keep the
current UI for Private Messages.
Center aligned the icons from streams and decreased the font-size of
the icons from the global filters.
This dramatically improves the visual appearance of the left sidebar.
Fixes: #11917.
Blockquotes and unordered lists had a large amount of space above them
when preceded by a paragraph tag, which looks ugly. This is a common
issue with the CSS rendering of essentially all markdown
implementations (e.g. GitHub has this bug).
We resolve the issue by reducing that whitespace with negative
margins. Hopefully, this won't create other weird glitches in the
process.
Fixes#11631.
This is the part where the whole selection is analyzed to get the
`start_id` and `end_id` of the messages that are selected (the
loop part of the copy handler).
This is extracted and exported as well.
All the inline javascript code present in email_log.html(which is
rendered when the user visits "/emails" in development mode) is
transferred to a new file: email_log.js in portico/ directory.
Fixes#11608.
Private messages too have non-`undefined` stream name. It is usually
an empty string. The check has been changed to not check specifically
for stream name to be undefined.
Color and background is made according to "day mode"
exclusively here because when copying the content
into, say, Gmail compose box, the styles come along.
This is done to avoid copying the content with dark
background when using the app in night mode.
We can avoid other custom styles since they are wrapped
inside another parent such as `.message_content`.
This adds a parent selector, `rendered_content`, to night mode syntax
lighlight selector. This helps us in getting the "day mode" syntax
highlight styles in night mode.
This adds a class `rendered_markdown` for all the elements which have
rendered markdown content; This is done to add different styles for
rendered content in day mode and night mode.
Also replace the element selectors from CSS to use the class.
Using lazysizes we only load images if they are in view.
This decreases load time and save more bandwidth since images are loaded
after html is loaded and if they are on screen.
Fixes#3564.
The delete operator could throw a TypeError when attempting to
remove a non-configurable property, which is rare in practice since
they can only be created using `Object.defineProperty()` and
`Object.freeze()`. We also never uses the output of `del()` anyway.
Instead of using the `trapsarent` keyword, which is interpreted
as Safari as black with an opacity of 0%, re-use the gradient colors
themselves in order to lead to a single color gradient. This allows
for the homepage to look the same regardless of browser.
Fix#11985.
This commit removes inline javascript code present in
accounts_send_confirm.html and moves it to signup.js. This page is
rendered when the "/accounts/send_confirm" endpoint is visited. An
empty div element is added in accounts_send_confirm.html with
unique data-page-id attribute to make it more easy to find in which
page we are, while working with the javascript code.
This commit removes inline javascript code present in reset_confirm.html
and moves it to signup.js. The reset_confirm.html page is rendered when
the user visits "/accounts/password/reset" confirmation page. An empty
div element is added in reset_confirm.html with unique data-page-id
attribute to make it more easy to find in which page we are, while
working with the javascript code.
This commit removes inline javascript code present in reset.html and
moves it to signup.js. The reset.html page is rendered when the user
visits "/accounts/password/reset". An empty div element is added in
reset.html with unique data-page-id attribute to make it more easy
to find in which page we are, while working with the javascript code.
A new javascript file "dev-login.js" is created in static/js/portico/
and the inline javascipt code present in dev_login.html is transferred
to that file. An empty div element is added in dev_login.html with
unique data-page-id attribute to make it more easy to find in which
page we are, while working with the javascript code.
This commit removes inline javascript code present in create_realm.html
and moves it to signup.js. The create_realm.html page is rendered when
the user visits "/new". An empty div element is added in
create_realm.html with unique data-page-id attribute to make it more easy
to find in which page we are, while working with the javascript code.
This commit removes inline javascript code present in
accounts_home.html and moves it to signup.js. The accounts_home.html
page is rendered when the user visits "/register". An empty div
element is added in accounts_home.html with unique data-page-id
attribute to make it more easy to find in which page we are, while
working with the javascript code.
This commit removes inline javascript code present in login.html and
moves it to signup.js. An empty div element is added in login.html
with unique data-page-id attribute to make it more easy to find in
which page we are, while working with the javascript code.
slice always returns a new string, so this could have been motivated
by ensuring we always duplicate the string, but reading the code, it's
already sliced by the caller.
This is the follow-up of PR #10267.
Here, we add typeahead for slash commands `/me` and `/poll` in compose box.
The slash typeahead will open only when `/` is the first character and all
slash commands will be displayed when one types `/`, as this helps a lot in
discoverability. This also adds a description of what the slash command
does in the typeahead.
This also remove:
- meta.current_bot_element: As usage of meta has been wrongly exploited, we
should refrain us from using meta this way i.e. to share variable between
function using the global variable, as they reduce code readability.
- update_view_on_deactivate_reactivate_failure: Again to deduplicate the the
code we're compromising with readability which isn't worth it here, also
we need to this because we have removed above meta key.
We should pass row as an argument to update_view_on_deactivate because we
update deactivate view of a row when the user get activated/deactivated by
the event system.
This also removes a redundant data variable.
This fixes the confusing behavior that errors sending messages were
not immediately user-visible.
Based on work by Dominik Gryboś in #11479.
Fixes#10537.
This disables the Deactivate button for the current user in the Users tab,
so that it becomes hard to deactivae yourself accidently from Users tab.
Fixes#10427.
Apparently, this has been broken since
dee4e3fb89, due to the beforeSend code
here overriding the default beforeSend function that sets the CSRF
token. The correct fix was actually to just run the relevant code
directly before the channel.patch call.
Fixes#11938.
It is observed in Mozilla margin was considered from other side of thumbnail
due to some special padding issues observed in mozilla.
To fix this top and left value are assigned to 0 so that it automatically
takes its correct position in all browsers
Fixes#11867.
When new PMs came in, we would do a little
animation to show you the incoming message.
Unfortunately, it was broken and would animate
too many things. (The code looks at a single
var to see if PM counts changed, but there are
actually mulitple PM counts. We could fix that,
but we decided that this feature just isn't
worth the complexity.)
We still animate incoming mentions.
Fixes#11868.
This renames references to user avatars, bot avatars, or organization
icons to profile pictures. The string in the UI are updated,
in addition to the help files, comments, and documentation. Actual
variable/function names, changelog entries, routes, and s3 buckets are
left as-is in order to avoid introducing bugs.
Fixes#11824.
When we try to hover over Open or Download they were not highlighted
in night mode, because of incorrect specificity. This commit adds
highlighting in night mode (possibly fixing a regression when we made
night mode less aggressive about hover).
Fixes#11887.
This allows user to download the latest version of android apk from
the apps/android.
This will help the users who use Android without Google Play to
download the app and install it with ease.
To implement this I added a Download APK link on the apps.html page
which always points to the latest released version.
Fixes part of #11647.
Or on the scroll triggered by that resize.
Then we don’t need a kludge that skips the resize handler in
situations where it might hide popovers.
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
This makes the "more topics" option which appears below the list of
known topics in the left sidebar appear only when it's possible there
are actually more topics to be displayed. Two specific cases it
resolves completely include:
* Newly created realms; this widget was a common source of confusion
for new organization administrators.
* Newly created streams.
There are still some corner cases this doesn't handle, e.g. if you
just joined a private stream with protected history, but there isn't
as easy a fix for those.
Essentially rewritten by tabbott to fix code duplication and comment
extensively.
Fixes#10265.
As a follow up of commit (bf1c9420df), this
commit removes the `build_realm_day_mode_logo_widget` and
`build_realm_night_mode_logo_widget` function , and changes
`build_realm_logo_widget` to take single argument `is_night` and depending
on this argument, corresponding `day mode` or `night_mode` widget is
handled.
It was impossible to add emoji to the message or to react on other's
message in mobile browsers because emoji popover used to get closed
due to the resize event being fired by the virtual keyboard. This
commit solves this issue by ignoring the resize event when the user
is trying to use emoji popover.
Fixes#11448.
We have this strange business requirement that the
blue-ish highlights for the current PM go into the
left gutter and all the way to the right edge.
We also have markup that treats the list of PMs
as a list inside the list item for the "Private
messages", which makes sense logically.
Before this change, the padding was done for the
outer top-left `ul`, but that caused the inner PM
rows not to have that padding when you hovered them.
Now we pad each individual list item and/or inner
list item or div.
Fixes#11879.
Firefox and Chrome handle selection of multiple messages differently. FF
creates multiple Ranges and Chrome creates one. Code written previously
terminated when we got an empty Range or Range with same starting and ending
message. This behaviour was incorrect since the selection was valid.
* Check for same message is done after looping through all the ranges now.
* `construct_copy_div` is called once since it is much easier to determine
start_id and end_id with confidence and this avoids any overlap between
same message ids.
Extended by tabbott to include a ton of comments on how this works.
Fixes#11805.
This changes the "new private message" button to be instead "new
conversation" when looking at PMs, to avoid confusion that the button
was the right thing to do to reply to the current private message
conversation.
Fixes#11679.
Even though there are only ever zero or one active
topic widgets in our current sidebar, it's almost the
same amount of code to just manage them with a Dict.
Also, we can more easily do possible future features
like setting streams to be always-open.
This moves the configuration of widget type from settings_org to instead
live in respective HTML templates, via `data-widget-setting-type` and we
also remove `get_subsection_property_types` and refactor function
`populate_data_for_request` accordingly.
Fixes: #11708.
This fixes the bug where the `Saved` state button faded out almost
instantly (that is actually 300 ms) and `Discard` button fades out
along with `Saved` state button; the key problem here was that the
setTimeout intended to fade was actually delaying the transition from
"saving" to "saved".
Now, first of all, we use `setTimeOut` function to fadeout elements giving
fadeout_delay time as `800 ms` and we hide discard button during `saving`
state. Also, when `Discard` button is selected, `Save changes` and `Dicard`
fade out simultaneously.
Fixes: #11737.
This was introduced in e0236646
For 1.5 years we did not find a case that needed it (besides the
`a` tag hover state, that is not obvious if it was needed or it was
used as an example)
It is not obvious if this solution was a good idea. The concern was
that `body.night-mode` is more specific than `body` and some styles
might override others less specific in cases we might not want that.
Of course, we want that in the majority of cases, and css-specificity
rules are not simple to comprehend.
Good further reading:
http://cssspecificity.com/https://specificity.keegan.st/
The added complexity of the resulting styles and the added code that
might not serve any practical purpose seem to not be worth it.
If you click on the avatar, we now show the menu
right next to the avatar. The current behavior
is particularly funny for long names. (I confirmed
this with Rishi.)
This fixes several bugs with /me messages:
* We no longer hover name if you're over
the message.
* We now launch the user popup if you
click on the name.
* Even if you click on the avatar, we
launch the user popup to the right
of the name. (I think this is odd,
but it's consistent with how we
do it for normal messages.)
The underlying problem here is that you have
two possible organizations.
From a logical standpoint, the image and
name go together (and both launch the user menu):
img Alice | says hi
From a physical perspective, the main message
is "Alice says hi" and it's aligned differently
from the image:
img | Alice says hi
Our HTML reflects the latter.
HTML doesn't allow overlapping diffs, of course,
so you have to pick your poison.
One goal of this commit is to just make the "happy
path" code a lot easier to read. It should be
pretty easy to verify that in this diff.
And then more stuff is now in me_message.
This is a pure code move, and it doesn't fix these
structural issues yet:
* the "say hi" part of "/me says hi" is
inside ".message_sender" (due to legacy
positioning issues)
* the avatar is outside of .sender-status
(again due to legacy positioning issue)
* we don't have sender_info_hover on
the sender name (which causes it not
to launch the user menu)
The code that was removed here wasn't doing what it
was intending to do, and we really just want to pop
up the user menu above the currently selected message.
This fixes some annoying copy-paste issues we've seen with users
accidentally getting a weird invisible unicode character in their URL
format string when trying to copy-paste an existing linkifier to
use for a new linkifier.
Fixes#10828.
Previously, because our check for whether to close compose for clicks
on the page body was looking at popover-content, not popover, parts of
larger popover-title areas (e.g. the big avatar at the top of the user
popover) did not have the proper click handler behavior.
Also, rearrange the comments to be a bit clearer.
The modal-backdrop and user-profile-modal had their on-click behavior
overridden to simply hide the modal, thus preserving the compose box.
Keeping the compose box open after viewing a user's profile feels
like a more natural UX.
Tweaked by tabbott to move the fix into the central click handler.
Fixes: #11585.
Adds possibility for users to use | as an OR-operator (besides ,)
when searching for other users.
This is a thing reasonable folks might try, and | in the thing to
search for isn't a realisitic possibility, so there's no real downside
to adding this.
Fixes#4109.
We now use 10px to the left of major elements in
left sidebar.
And we then explicitly use 19px for the following:
icons in top left
indent for (more conversations)
stream hashtag icons
stream lock icons
We also kill off 2px of gutter that was caused
by whitespace in the HTML (and was slightly messing
up alignment of names beneath "Private messages").
Finally, we make the topic indent a bit more explicit.
Rishi Gupta
Abhinav Singh
Alexandra Ciobica
Nikhil-Vats
Tim Abbott
Vaibhav
Yash Rathore
Wyatt Hoodes
matkaczmarek
vinitS101
Thomas Ip
Priyank Patel
Rhythm
Steve Howell
Anders Kaseorg
Sebastian Morr
Eeshan Garg
Marco Burstein
Hemanth V. Alluri
Vishnu Ks
Pragati Agrawal
Shubham Dhama
Tim Wissel
sameerchoubey
vipul chhabra
Ben Muschol
vsvipul
theredcap
Challa Venkata Raghava Reddy
Abhishek Kumar Singh
Siddharth Varshney
Boris Yankov
Casper