Set width of the heading tag displaying user profile name heading, which
doesn't let the edit button get pushed off the user profile modal.
Ellipsis property is applied to user profile name on text overflow.
Fixes: #23781.
Changed the width of the file column to show the names properly,
while making sure that the table UI remains consistent in different
languages too (checked the same for Russian language).
Drop the file size column if the viewport is less than 992px (lg_min)
to ensure that the size word doesn't break when there are no uploaded files.
Discussed on CZO thread.
Changed the position of the Date uploaded arrow to stay visible
in all view ports and added word-break to prevent spill over of Mentioned-in
and date uploaded.
Fixes: #23738
Since we do not currently have live update on newly
created ui for user group management, alert shown
after successful creation of user group apeared across
full width of right panel of #groups overlay. Which
made it look a bit awkward, so we add margins to that
alert info.
This removes the focus outline on `simplebar-content-wrapper` in
the left sidebar and other places in the app when focused since
it doesn't look visually nice.
This commit fixes the code which incorrectly set the cursor
property to "pointer" for input and textarea elements where
only select elements should have it. The code causing this bug
was added in d708bc338.
Some non-English characters overflow when the line height is reduced
for the tooltip text. This commit increases the line height of the
tooltips to accommodate these non-English characters and fixes the
hotkey hint margins for the same.
This commit enables the stylistic set "ss01" in Source Sans 3
font family which contains stylistic variant of the upper-case
character "I", which contains two bars, one each on the top and
bottom of the letter. This provides a uniform look across all
the characters when used in the hotkey hints of the tooltips.
The second line of a multi-line tooltip generally desctribes the
additional information which helps the major text, i.e. the first
line of the multi-line tooltip, hence it would be a good idea to
add italics styling, to differentiate it from the main title. We
describe a simple ".italic" class for the same.
We also add a shorter line height to this description using the
".tooltip-inner-content" class.
We add the support for hotkey hints for the tippyjs tooltips through
the hotkey_hints handlebar helper.
The hotkey_hints helper takes space seperated string arguments and
returns a span containing all the hotkeys with the required classes
for styling.
We also add a simple node test for the hotkey_hints handlebar helper.
Part of #21753
We use hsla(0, 0%, 20%, 1) for the light theme background color and
hsla(0, 0%, 0%, 1) for the dark theme. The text inside the tooltips
should be white in color, 14px in size and have a line height of 15px.
With one line of text, we want the height of the tooltips to be 25px,
i.e, line height (15px) + padding (5px + 5px = 10px).
Part of #21753
This commit adds dropdown-list-widget element in "General" section of
stream settings for can-remove-subscribers-group setting. For now we
only show role-based system groups as the options.
Previously, subscription rows with a remove-subscription-button were
much taller than those without. This will be problematic when the new
permissions setting makes it possible for the current user to have
permission to unsubscribe the target user from some streams but not
others.
Fix this by both making the button a bit less tall and setting a
minimum height for the rows. Probably a nicer CSS solution is
possible, but this is enough to unblock merging a much larger project.
Fixes#22524.
This affects both the banner in the main compose box and the banner
in the message edit compose box. The use of ProgressBar has been
replaced with a more simple CSS (with light Javascript) solution.
The classnames are changing because the upload banner is now a
template rendered and remove()-ed from a banner container
(#compose_banners in the composebox, and a new div for banners in the
message edit view). It used to be in the send_status container so
there are a lot of class renames across the codebase.
The image preview in the 'upload_widget' would scale images that are
wider than the intended square shape for custom emoji; this resulted
in a misleading preview, because the server will instead crop such
images to take their leftmost square.
Fix this using 'object-fit: cover', to have the browser do something
similar.
Previews of the current bot avatar and the uploaded bot avatar were not
displayed during bot creation or editing.
We address this by extending The 'upload_widget' component with with
'preview_text' and 'preview_image' parameters to provide a preview of
the image that will be used as the bot's avatar during bot creation or
editing.
Fixes#23023.
Due to some quirks of CSS specificity, a rule for 0 `right-padding` was
overriding a rule for 2px `right-padding` for topic names.
This is now corrected, and the padding increased to 3px for a less
cramped look, for PMs, topics and streams. Repetition of CSS has also
been removed.
We override the bottom margin added by bootstrap for
url type custom profile input in user profile page
and all the inputs in edit-user form. Previously, this
was handled by form-horizontal class which was removed
in #24057.
For most of the other text-type inputs, it is overridden
in app_components.css and for checkbox-type inputs, it is
overridden by other bootstrap CSS itself. But that only
handles text-type and checkbox-type inputs inside
".new-style" element and not url type inputs.
Some other inputs already have specific CSS to override the
bootstrap CSS.
For the same reason, there is no need to override bottom
margin for inputs in organization profile as there is no
url type inputs in that page and this commit removes the
CSS for it.
Creates a shared `disabled_setting_tooltip` class that can be
reused in cases where a personal or organization setting button
or input is disabled and a tooltip is added to give information
about why the user cannot change/access the setting.
Earlier the todo and poll widgets' UI differed a lot, especially in the
font size and weight, and the color and shape of the checkbox and vote
count box.
Now the font weights and sizes are consistent in both the widgets and
the todo widget's checkboxes and poll widget's vote count boxes are
styled similarly.
This is the rebased and cleaned version of #21006, and is visually near
identical.
Fixes: #20283.
This commit removes the margin-bottom CSS added for
select elements to override the margin added by bootstrap.
Since we have removed the bootstrap CSS rules for
select elements in previous commits, we can remove
the overridden CSS in this commit.
This commit also removes margin-bottom CSS for input
element in one case, because CSS in app_components.css
already overrides the current bootstrap CSS for input
element.
This commit adds "bootstrap-focus-style" class to the select
elements such that we can add CSS rule for focusing a select
element at single place only using this class.
This commit adds bootstrap CSS rules used for select elements
used in different modals in modal.css.
This change is done so we can safely remove select CSS
rules from bootstrap.css as a part of our process to
remove bootstrap.
This commit also changes the CSS for propagate mode select
element in "Move messages" modal to use ID as selector
instead of class such that the width property can be
overridden correctly.
This commit adds bootstrap CSS rules used for select
elements in settings page in settings.css.
This change is done so we can safely remove select CSS
rules from bootstrap.css as a part of our process to
remove bootstrap.
Due to this change, a couple of settings have lesser
margin at the bottom than before, but they look fine
with lesser margins and anyways had unnecessarily
larger margin before.
We also update the selector used to set width of
desktop-icon-count-display setting such that the
default of 220px is correctly overridden by the
specific CSS for this element.
This commit adds bootstrap CSS rules used for select
elements in stream settings to existing CSS in
subscriptions.css.
This change is done so we can safely remove select CSS
rules from bootstrap.css as a part of our process to
remove bootstrap.
This commit adds bootstrap CSS rules used for select elements in
invite UI in zulip.css.
This change is done so we can safely remove select CSS rules from
bootstrap.css as a part of our process to remove bootstrap.
This commit also adds class to a couple of select elements in invite
UI such that we can use those class to write CSS as using IDs would
lead to the dark-theme background not being applied correctly.
This commit adds bootstrap CSS rules used for select elements in
activity support page in activity.css.
This change is done so we can safely remove select CSS rules from
bootstrap.css as a part of our process to remove bootstrap.
This commit adds bootstrap CSS rules used for org type select
element in sponsorship page in billing.css.
This change is done so we can safely remove select CSS rules
from bootstrap.css as a part of our process to remove bootstrap.
We also remove inline style for this element and instead add
it with other CSS in billing.css.
This commit adds bootstrap CSS rules used for select elements in
devtools integrations panel in integerations_dev_panel.css.
This change is done so we can safely remove select CSS rules from
bootstrap.css as a part of our process to remove bootstrap.
This commit adds bootstrap CSS rules used for select
elements in realm creation form to the existing CSS
in portico_signin.css.
This change is done so we can safely remove select CSS
rules from bootstrap.css as a part of our process to
remove bootstrap.
This commit adds bootstrap CSS rules used for select element
in dev login form in portico_signin.css.
This change is done so we can safely remove select CSS rules
from bootstrap.css as a part of our process to remove bootstrap.
This commit refactors the template code for source-realm
select element to have same structure as other inputs
and select element in the page. Thus this change also
makes the styling of source-realm select element consistent
with other select element in the page.
The upgrade banner was being clipped for narrow width screens
and was only partially visible. This commit changes it to instead
wrap the content such that complete content is visible on the
screen.
We also decrease the right margin for icon in the banner such
that the text of the banner fits in one line for at least normal
screen size and zoom in stream settings overlay.
Removes the info icon with the tooltip information and replaces
it with a question help link icon to the help center article on
deactivating an organization.
Also, when the button is disabled, adds a tooltip on hover that
explains only organization owners can deactivate an organization.
If the current user's owner role is changed, then the button and
tooltip are live updated.
Part of #22892.
