The alerts in portico were not being closed since the class responsible
for hiding them — `home-error-bar` was defined in `web/styles/zulip.css`
which isn't being shared with portico. This commit moves this class to
`web/styles/alerts.css` which is shared with portico, and fixes the bug.
This is prep commit for the alert banner redesign, which adds flex
layout to the alert-box container and modifies the animations logic to
work with the new layout.
Previously, when searching for extremely long queries,
they would overflow beyond the screen.
This commit fixes the bug by ensuring that long
search queries do not overflow.
Fixes: #29568
This is part of an effort to remove all pixel font sizes
from most stylesheets. We won't scale this with font size
because the flatpickr doesn't scale with font size.
This commit improves the saved snippets UI through the following ways:
- Reduces the space between the saved snippet title and description for
a more interconnected feel.
- Changes the delete icon from the old font-awesome icons to using the
new icon button component.
- Adds line-clamping to the saved snippet description to display two
lines of text instead of one, presenting the user with more context.
Zulip has an invariant that all unread messages must be in channels the
user is subscribed to. Therefore, in this commit, we add a feedback
widget to notify users when a channel to which they are not subscribed is
skipped while marking messages as unread in an interleaved view.
Fixes#23470.
Co-authored-by: Hemant Umre <hemantumre12@gmail.com>.
This is an attempt to fix somewhat #33685. More finesse can
probably be done in the area, but hiding descriptions on a title-
by-title basis will be non-trivial.
This commit improves the design of the inline topic edit UI by making
the following changes:
- Increases the dimensions of the text input element.
- Fixes the font scaling inside text input element.
- Replaces the old save and cancel buttons with the new icon buttons.
Fixes#33155.
With the larger, flexibly sized right sidebar, we want to allow
for the middle column to expand to fill its place even outside of
the "Use full width on wide screens" setting.
Some browsers, notably Safari on both iOS and macOS, are not yet
aligned with the CSS specification, which does not force layout
containment but does force an independent formatting context
(see https://github.com/w3c/csswg-drafts/issues/10544).
The little test here will allow us to deliver em-aware container
queries to browsers that are spec aligned, and fall back to media
queries in browsers that are lagging.
In our css variables, we were using sidebar and column interchangably.
But, sidebar is 10px less wider than the column. This commit makes no
behaviour change, but renames variables to use column where necessary
and uses variable for sidebar instead of a fixed 240px value.
This commit fixes the inconsistent positioning of the unread dot
on the left sidebar toggle button. Instead of using fixed pixel
values, the position is now defined using a relative percentage,
ensuring consistent alignment.
The unread dot's dimensions are also expressed in ems for better
scaling and alignment at different font-sizes. And an unnecessary
(and confusing) 0 was removed from the templates.
Co-Authored-By: harshbansal8705 <harsh@harshbansal.in>
This width should be set for .column-right at wider screens,
which it already is in another CSS rule, so this style was a
duplicate. The duplicate was causing issues because it was
overriding the `width:auto` that comes into play at narrower
screens when the buddy list isn't always visible. When the
header right column is too wide, it covers up the search button
and makes it not hoverable or clickable anymore. This fixes
that.
Despite the comment in `ui_init.js`, this class is never in fact
removed, and appears only to add unnecessary complexity to certain
selectors, which are here cleaned up.