This commit adds a boolean field `mentions_topic_wildcard`
to the `MessageRenderingResult` dataclass.
The field is set to true only if message rendering determines
the message has an actual topic wildcard mention in it (and not,
e.g., topic wildcard mention syntax inside a code block).
The rendered content for topic wildcard mention is
'<span class="topic-mention">{wildcard}</span>'.
The 'topic-mention' class is the identifier for the wildcard
mention being a topic wildcard mention.
We don't use 'data-user-id="*"' and "user-mention" class for
topic wildcard mentions and eventually plan to remove them for
stream wildcard mentions too in a separate mini-project.
This commit adds a 3px column between the `controls` and `time`
areas, which keeps the controls from crowding the time for
languages with longer time markers.
To make the layout easier to reason about, this includes the
minimum width for the time column as part of the message-box
grid definition.
This bad rendering was the result of unwanted css applied
in the stream description. In message view header, the stream
link (title) we have defined has css defined but the markdown
rendered stream link in stream description had the same class
resulting in unwanted css applied to it.
Fixes: #25961.
Signed-off-by: Akshat <akshat25iiit@gmail.com>
The bootstrap CSS was not re-added to the input for number of licenses
in "Pay by invoice" section of upgrade page while removing the bootstrap
CSS for "number" type inputs from bootstrap.css.
This commit fixes it by re-using the existing CSS for other number type
inputs.
This commit adds filter_text_input class to various search inputs
used across the app. This new class is used to re-add the bootstrap
CSS rules such that we can remove the CSS from bootstrap.css.
This commit re-adds bootstrap CSS for custom time limit inputs
used by various settings by using more specific selector in
settings.css.
This is a prep commit for removing bootstrap CSS for text type
inputs.
This commit re-adds bootstrap CSS rules to ".settings_text_input"
selector in settings.css and this helps in adding the bootstrap
CSS to text inputs used in settings.
This is a prep commit to remove bootstrap CSS for text type inputs.
This commit re-adds bootstrap CSS for search input in
integrations page using a more specific selector in
integrations.css. We also change the selector to use
a class name instead of "input".
This is a prep commit for removing bootstrap CSS for text type
inputs.
This commit re-adds bootstrap CSS for text inputs in devtools
integrations page using a more specific selector in
integrations_dev_panel.css.
This is a prep commit for removing bootstrap CSS for text type
inputs.
This commit re-adds bootstrap CSS for the input
used to set the email to which emails will be
forwarded in the development environment "/emails"
page by using a more specific selector in
email_log.css.
This commit also increases the width of input to be
consistent with many other text type inputs and this
also helps in viewing the full placeholder text.
This is a prep commit for removing bootstrap CSS for
text type inputs.
This commit re-adds bootstrap CSS for "Organization website"
input in sponsorship page using a more specific selector in
billing.css. This change is done by re-using the existing
CSS for number type inputs and also removes the height
property which is not required.
This is a prep commit for removing bootstrap CSS for text
type inputs.
This commit re-adds bootstrap CSS for text inputs in realm details
page by using a more specific selector in activity.css. The CSS
added for search input includes bootstrap CSS applied using
".search-query" and "input[type="text"]" selectors.
We remove the CSS for search-query CSS from bootstrap.css
as the search element in app navbar already overrides the
bootstrap CSS.
This is a prep commit for removing bootstrap CSS for text type
inputs.
This commit re-adds bootstrap CSS for text inputs used in poll and
todo widgets by using a more specific selector in widgets.css.
This is a prep commit for removing bootstrap CSS for text type inputs.
This commit re-adds the required bootstrap CSS rules for inline
topic edit input to the specific selector in zulip.css.
This is a prep commit for removing bootstrap CSS for text type
inputs.
This commit re-adds required bootstrap CSS rules for
search box input element.
We also need to add the code to handle dark theme CSS
here to make sure the CSS for dark theme is prioritized
correctly.
This commit re-adds bootstrap CSS for custom expiration time
input in invite modal.
We also need to add the code to handle dark theme CSS here to
make sure the CSS for dark theme is prioritized correctly.
This commit also refactors the CSS to modify the selectors to
be simple and remove unnecessary IDs.
This commit re-adds bootstrap CSS rules to ".modal_text_input"
selector in modal.css and this helps in adding the bootstrap
CSS to text inputs used in modals.
This is a prep commit to remove bootstrap CSS for text type inputs.
We don't have 800 font weight available, so the font weight defaults
to 700, so we use it directly here to avoid any changes when
we convert to variable font.
`Lighter` for this icon gets converted to 100 font weight, but the
visual difference starts to appear only after 500 font weight so,
we keep at 400 to begin with, which is what we support.
This commit adds a cancel button to the upload banner, replacing
the previous close icon. Now, the cancel button is used to cancel
the upload process, while the close icon is used to remove the
upload banner without interrupting the upload.
A new case has been added to the switch statement in the 'upload.js'
file to handle the functionality of hiding the banner called
'upload_banner_hide_button'.
Replaced the functionality of the 'compose_banner_close_banner' case
inside the switch statement with a new case called
'upload_banner_cancel_button'. The cancel button is now assigned
the selector 'upload_banner_cancel_button'.
`Cancel` button is only preset for banner which tracks
progress while a file is being uploaded.
To maintain consistency with other banners, the cancel button's
dimensions and color have been adjusted to match the style of other
buttons present in different banners.
Fixes: #21156
Archiving a user/stream notification stream disables
user/stream notifications.This commit adds a warning
that notifications will be disabled while archiving
any notification stream.
Fixes#22110.
Co-authored-by: Victor Fróes <71036803+vfroes21@users.noreply.github.com>
Co-authored-by: Isabella Carmo <isabella.carmo@hotmail.com>
The CSS for modals uses "--color-background-color" to set
background color of modal. But the variable is defined in
zulip.css which is not available for portico pages and thus
the email visibility modal was not rendering as expected in
"Terms of service" page.
This commit defines the "--color-background-color" variable
in portico.css such that it is available for portico pages
as well.
This commit updates the text on email confirmation page to
make it more clear what's going on and why the user needs
to check their email.
Fixes#25900.
This is logic from 10 years ago (dbc4798594)
that is no longer relevant. It seems like we used to show the
search bar open all the time and only showed the buttons when
there was focus in the search bar. Now we close the search bar
when it's not being used, and no longer need to update button
visibility or disable the search close button.
Simplebar seems unaware of the `max-height: 1000px` on
`.subscriptions-container`, and therefore does not properly provide
a scrollbar when it's needed.
This commit adds a `max-height` to the stream Simplebar container,
ensuring that otherwise hidden content that Simplebar believes to
be visible can be scrolled to.
Finally, rather than rely on magic numbers or math done in comments,
this commit establishes CSS variables for all relevant modal-element
heights, doing the math inline using CSS calc().
Fixes#26107.
This traverses the DOM to the <pre> element containing the
copyable material of interest.
The button is attached to the .codehilite element to ensure
that the button does not move with horizontally-scrolling
code content that exceeds the width of the content column,
as happens frequently at mobile scales or for very long
lines of content.
Fixes#26093.
This commit removes settings_text_input class from url type inputs
and we instead add the width property to settings_url_input.
Note that we might instead have a single class for all type of inputs
instead of having different classes for url, password and text type
inputs in further commits.
We remove the modal_text_input class from password and url type inputs
in modals and add the width property CSS to modal_password_input and
modal_url_input instead.
Note that we might instead have a single class for all type of inputs
instead of having different classes for url, password and text type
inputs in further commits.
We use url type inputs in the add and edit custom field modals
and also to show the url type custom fields in "Profile" panel
and "Manage user" modal.
This commit re-adds the bootstrap CSS rules to these specific
input elements using modal_url_input and settings_url_input
class and thus removes the CSS for url type inputs from
bootstrap.css.
We might replace the new class added here with a common class
for all type of inputs in further commits.
We use password type inputs for API key and password
change modal in the main app and in login, register
and password reset pages.
For the portico pages, i.e. login, register and
password reset pages, the bootstrap CSS is already
overridden by our custom CSS defined in
portico_signin.css and some of the CSS added by
bootstrap is redundant. Only outline property was
being applied by bootstrap on focusing the input
which has been added to CSS in portico_signin.css
in this commit.
For the inputs used in app, i.e. API key and password
change modal, we have already added the CSS rules of
Bootstrap using "modal_password_input" class.
Thus, we can remove the CSS for password type inputs
from bootstrap.css.
This commit adds specific CSS styles from bootstrap to password
type inputs in modals using modal_password_input class. This
change helps us in removing the bootstrap CSS for password type
inputs in further commits.
We might replace the new added class with a single class which
will be used for all type of inputs in further commits.
We use pull-right class for copy button with the multi-use
invite link only and this commit adds CSS for that specific
element. This commit then removes the bootstrap CSS for
pull-right class and also removes pull-right class from the
copy button since it is no longer required.
This commit adds the required bootstrap CSS rules for fieldset
elements to the specific selector in portico_signin.css and
removes the CSS from bootstrap.css.
We use input-block-level class only for search input
and this commit adds the required bootstrap rules for
it to the specific elements in search.css. So, we can
safely remove the CSS defined for this class in
bootstrap.css.
Previously, we used to have top and bottom paddings of 4px to
the select elements but it was removed in a208da9c4d to make
sure that text for the selected option is aligned properly.
All other select elements have height set to 30px, but the
select elements in stream settings page had height set to
"fit-content" and so they looked ugly after removing the
padding.
This commit sets the height of select elements in stream
settings to 30px.
Previously, the HTML structure of unread banners continued to utilize the
old stylings. We are currently in the process of simplifing both the
compose banner and unread banner stylings into one. These change will
update the HTML structure to be the same as the compose banner and use
the new stylings.
Previously, we have duplicate stylings in compose banner and unread banner.
This is rather messy and creates a lot of styling rules. We should define
an abstraction for them. This change will rename compose_banner
to main-view-banner.
Previously, we have duplicate stylings in compose banner and unread banner.
This is rather messy and creates a lot of styling rules. We should define
an abstraction for them. This change will rename compose_banner_action_button
to main-view-banner-action-button.
Previously, we have duplicate stylings in compose banner and unread banner.
This is rather messy and creates a lot of styling rules. We should define
an abstraction for them. This change will rename compose_banner_close_button
to main-view-banner-close-button.
Added a copy-to-clipboard button to the code blocks in the API and
Help Center docs. Previously, copying code from the docs required
manual copying, which was cumbersome.
Used the same copy-to-clipboard svg icon as the one used in
web/src but manually created the button within the js function instead
of using a template. Updated the pre CSS element to have relative
positioning and gave the copy-codeblock element absolute positioning
to ensure the button stayed in the top-right corner.
Fixes#25726.
This commit darkens the text-message color in the light theme
to the HSL equivalent of a dark gray (#262626).
This is the first time in the Zulip codebase where one CSS
custom property is set to another: the dark theme preserves
its use of `--color-text-default` in this way, but can be
adjusted independently of the reset of the theme in the future
by setting a different color value on
`--color-text-message-default`. Related reading on this
technique:
https://css-tricks.com/a-complete-guide-to-custom-properties/#aa-properties-as-properties
Fixes a part of #22022.
This in-progress feature was started in 2018 and hasn't
been worked on much since. It's already in a broken state,
which makes it hard to iterate on the existing search bar
since it's hard to know how those changes will affect search
pills.
We do still want to add search pills eventually, and when
we work on that, we can refer to this diff to readd the
changes back.
This commit revamps the invite type section of the "Invite user" modal
to provide a more intuitive user experience. The section now includes a
radio button option with two choices: "Send an email" and "Generate an
invite link." The email input box is hidden when the "Generate an invite
link" option is selected.
Fixes#24692.
* Remove `box-sizing` and `min-width` properties which have no
effect on `inline` positioned element. Modified class selector to
add `span` which reflects this while reading the CSS.
* Remove `2px` vertical padding and `line-height` which combined
are fighting for space??
Since we want the same space in recent topics to display the
compose box without overlapping with any other topics, it makes
sense to use a common variable.
This allows the recipient box to take 100% of the available
horizontal space, up to 175px. The effect is that the
compose-box buttons are available to users at mobile scales
(viewports of 400px wide or less).
This commit fixes the vertical alignment of "x" button in the
alert to be more closer to the center. We can still improve it
by probably using something like flexbox layout instead of
hard coding paddings or margins.
Fixes#25779
We move the simplebar scroll on the right sidebar to a little left
when there is an overlay scrollbar present so that user can drag
either of them.
When overlay / modal is displayed, scrollbar is hidden due to
the disabled scrolling on `html`. Reduce width of fixed elements
that will be visible in background and `html` so that they don't
occupy that extra space.
Also, I was over-thinking how we can get the scrollbar width. The
moment we allowed scrolling on `html`, it was easy to get the
scrollbar width.
This fix prevents the active-message outline from being obscured
under certain conditions, such as when setting a browser to zoom
out at 90% or less.
Suggested-by: Anders Kaseorg <anders@zulip.com>
This commit keeps the height of the dropdown consistent, even when
it's adjacent a multiline collection of pills in a group DM.
It also keeps the righthand buttons and narrows top-aligned, too.
Additional markup and CSS ensures that the < marker always stays
vertically centered with respect to the dropdown.
While this commit achieves what the subject advertises (fixing the
input box's height to match the recipient drop-down), but it does
so by relying heavily on flexbox's behavior to manage the height
of the elements and vertical centering, where necessary, rather
than positioning hacks or vertical padding.
This commit also removes some additional styles that do not make
sense (e.g., `min-width: 0`) or that need not be set.
Prakhar Pratyush
Karl Stolley
Aman Agrawal
Akshat
Sahil Batra
Ganesh Pawar
Wladimir Ramos
Palash Baderia
Ujjawal Modi
Daniil Fadeev
evykassirer
Lauryn Menard
Hardik Dharmani
Joelute
UBC Student
Akarsh Jain
Mateusz Mandera
Anders Kaseorg
Tim Abbott