This commit fixes the bug with the delete button of both profile
picture and realm-logo buttons. The button was shifted downwards
and was caused due to line height change in 5d64c21c38.
Found the correct value of 20px by checking the line-height in
one test organization on zulipchat.com where the button position
looks correct.
We show a spinner inside the button instead of hiding the button
and then showing the spinner in the bottom area. We also disable
the button to avoid repetitive clicking by user.
We had our input elements for stream settings inside li tags
and their alignment was managed using CSS. We move away from
this HTML structure to have inputs and labels inside divs for
two reasons. First is that if we want to later refactor the HTML
to have some different design, then having them inside `ul`
requires complex changes to CSS and eventually we would have
to move away from using `li`s for the part that is changed to
have a different design. Second `li`s are generally not used
to organize input elements.
Above is an explanation of why this change is a preparatory
commit for shifting to have a tabbed design in the stream edit page.
So following changes are done to have a more consistent
HTML structure in stream types modal:
* Added modal-body and removed the non-standard
usage of the unordered list for settings header and inputs.
* Updated relevant CSS rules to have the same design during refactor.
Co-authored-by: Pragati Agrawal <pragati22066@gmail.com>
We had stream and group tab inside a common div with class
`subscription-group-list` due to this adding any info
elements like alert boxes that were specific to one of them
became difficult. To fix this we keep them in their own
`.tabcontent` div. This change also makes the handling of
display of different tabs a lot easier and cleans
up unnecessary javascript code that was handling the
display of common parent div of stream and group tab.
The Microsoft browsers such as IE and Edge has their own
show password that is a bit bugy and also conflicts with
the show password in Zulip that was added in #17305.
This fixes the issue by making the display none for the
ms-reveal that comes in the input.
More details can be found at
https://chat.zulip.org/#narrow/stream/101-design/topic/Show.20password/near/1173890
We remove the small CSS class, which set the font size as something
tiny, and also restructure it with a fixed height and more natural
markup for the reset link.
Previously, this used a slightly smaller font size than the default.
Given that it looks visually fine to use the default font size, it's
better to remove this inconsistency.
It's also worth noting that we plan to move this component to be
parallel to STREAMS in a way that is likely to also want the new font
size, so this is a step towards that goal.
This should make it more intuitive to add
new elements to the compose box (such as
banners), and it also makes it a bit more
clear for styling purposes that the same
geometry happens whether the compose box
is open or the buttons are visible.
I lifted the #compose_container div into
the server template. It's not totally
clear to me why we need both #compose
and #compose_container, but there are
some scary comments about 1400px that
made me too timid to address that quirk.
In passing I removed a clearly redundant
click handler.
For create stream icon specially, this is useful to allow user having
some extra space around the icon to click.
This fixes the bug that you can have the tooltip of "Add streams" and
by hovering at the bottom of `+` icon but clicking on it shows stream
search.
We add a popover on click which allows user to create or browse
streams too.
Reason for doing so:
At present, it is hard to discover how to join streams
and create new streams. In particular:
Users have a hard time finding the gear in the STREAMS
header in the left sidebar and realizing that it's relevant for them.
Even once a user is in the STREAMS menu, the Create
stream button is hard to spot.
Fixes#18694.
This moves this block of HTML templates, which are dynamically
rendered with some user data, to be managed by the frontend handlebars
template system.
This migration involves only displaying active alerts in the DOM, and
thus we no longer need navbar_alerts to have display: none by default.
This is important for showing popovers/menus with a light background
in Zulip's light theme.
We extend light-theme to show dark colours in night theme.
This commit divides the user_invite_restriction setting dropdown to
a checkbox and a dropdown.
The checkbox is used for 'realm_invite_required' setting and dropdown
for 'realm_invite_to_realm_policy'.
This separation of UI elements is fine as these two settings are
separate in database also and also helps in removing excess if-else
conditions and switch cases.
On small widths, add margin to right to action buttons so
that they don't they trigger scrollbar when clicked upon.
Make action buttons larger so that they are easier to click / tap on small
widths.
This commit disables the button and shows a loading spinner on
the button when signup request is being processed to avoid race
conditions caused by user clicking on the button multiple times.
The fix is done observing that for the case when form is invalid
the whole page is rerendered and thus we do not need to remove
the spinner and enable the button again and for other errors
we redirect to some other page.
And for the validation taking place in client-side, the button
is disabled and spinner is shown, only is form is valid, by
using "$('#registration').valid()".