The comment explains the reasoning, but this should make it a lot
easier for users to visually focus on the menu items in the sidebar.
Changed by tabbott to use the same width as the right sidebar itself.
Inspired by #17169.
From the commit history, this typo has always been there; because it
had the same priority as the `opacity: 0.5` for that element,
it can be nondeterministic whether the bug appeared.
Fixes#17476.
Follow up to #14768. This feature was already non-functional due to
.alert-display { display: none; }, and if we want to reimplement it,
we should do it using a modern library.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Remove the unused notifications-area wrapper. Remove the feature
detection code as all browsers recognize the <audio> element. Create
the <audio> statically with the page template. Use multiple <source>s
to let the browser detect the appropriate format instead of trying to
do its job for it. Remove the absurd loop="yes" attribute, which had
fortunately been specified on the wrong element.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit adds vertical-align: middle to .message_failed in zulip.css
which was necessary as the alignment of .message_failed wasn't matching
with rest of the message controls like .edit_content. This makes the
look of the message controls better that they don't look shifted.
Follow up #17666
This commit adds a new class for typeahead items that do not need
a presence circle. It is changed to support addition of new items
that do not require presence circle.
There should not be any visual change due to this.
This commit removes presence circles for special users like
all, stream, and everyone. This was discussed at
#design>Presence circles in typeahead, and this was justified
as presence circles for these special users will always be grey
circle and do not convey any information about presence of anyone.
This commit addresses the problem of user's status visibility to
some extent. It adds presence circles, like we have in buddy_list to the
typeahead suggestions that are given for mentioning users in messages.
Tweaked by tabbott to adjust vertical alignment of group mentions as well.
Testing for the changes is done manually in the developement server,
and also by updating frontend tests to address these changes.
Fixes: #17138
Fixes#16674.
The commit hides the tooltip for touch events on touch enabled device.
Touch events trigger both click and hover action,
leaving the hover action sustained until next click.
Hence it is better to hide the tooltip to avoid the clutter in UI.
This issue adds the appropriate padding to the
copy_generate_invite_link class. This fixes the copy link icon which
seemed to be shifted when clicked.
Fixes#16868
On a high-DPI display or with a non-default zoom level, the browser
viewport may have a width strictly between md_max = 767px and md_min =
768px. Use only the *_min bounds for consistency.
This requires queries with strict inequalities to express upper
bounds (width < md_min). Fortunately, that functionality is provided
by range context queries. Unfortunately, those are not supported in
all browsers. Fortunately, we can compile them away using
postcss-media-minmax. Unfortunately, postcss-media-minmax currently
subtracts 1px for strict inequalities anyway to work around a Safari
rounding bug. Fortunately, 0.02px should be sufficient for that, so I
submitted a PR:
https://github.com/postcss/postcss-media-minmax/pull/28
Signed-off-by: Anders Kaseorg <anders@zulip.com>
The changes were not live tested since search pill is not enabled.
However, this should look fine since the properties changed
were not depended upon 500px.
We use 767px for hiding left column.
The components changed here were tested to be working fine.
This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 775px.
We use 1199px for hiding right column.
The components changed here were tested to be working fine.
This change is not likely to introduce any regression as the
calculations in the components here were not dependent upon the
breakpoint being at 1165px.
A convenient copy-to-clipboard button was added in the Invite users to
Zulip modal, to make it slightly more convenient to share the
generated links.
The formatting is extracted to a template to make i18n and variable
substitution simpler.
Tweaked by tabbott significantly to simplify JS, HTML, and CSS.
Fixes#16442.
Z-index is added to the base class. This doesn't affect copy_code_button
in any way.
Attributes dropped/changed:
- background-color
- Base class on-hover property is now used.
- height, width, padding is now the base classes.
We can also remove the TODO now.
The base class will contain common styling which is used by both
copy_codeblock and copy_message buttons. This sets us up nicely
for following commit(s) which aims to unify the two button styling.
bootstrap sets <code> to use `Monaco` font by default. We don't
want to use this font since some characters are not clearly
readable like `()` appearing as `0`.
Hence, we use Menlo font by default if available.
Since `Monaco` font is only installed in macOS by default, this
mostly affected mac users.
css-loader@4 broke @import statements referencing files with
extensions other than .css, unless those @import statements are
compiled away by another loader. Upstream is more interested in
arguing that such @import statements are semantically incorrect than
applying the one line fix.
https://github.com/webpack-contrib/css-loader/issues/1164
Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit transitions all styles in app.css in the Django pipeline
to being compiled by webpack in an app-styles bundle, and renames the
various files to now be processed as SCSS.
To implement this transition, we move the old CSS file refernces in
settings.py and replace them with a bundle declared in
`webpack.assets.json` and includedn in the index.html template
Tweaked by tabbott to keep the list of files in `app.css` in
`webpack.assets.json`, and to preserve the ordering from the old
`settings.py`.
`<td>` elements are fixed-width, so we refactor the entire
`<table>` structure for responsive design.
This fixes a bug with how the `To:` block looks in other languages.
Fixes#9152.
Removed the top margin of input-group css
to prevent the double margins. Also fixed the
default-language positioning, and maintained
margin consistency in organization settings.
Fixes#8890.
`@everone` and `@all` will have a megaphone icon from FontAwesome in
place of the avatar.
Also, fix the `composebox_typeahead` tests to account for the images.
Fix#6635.
This makes it convenient to mention a stream you're not subscribed to,
which can be useful for communicating about where a topic is
discussed, for example.
Fixes: #5757.
In org settings, loading spinners are not visible, currently
because their size is very small.
Fix this, by increasing width and height of spinners and
adding spinner text, to make spinners more visible.
Fixes#8502