Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

modals: Re-add bootstrap CSS to password inputs in modals. 

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.
This commit is contained in:
Sahil Batra 2023-06-19 13:22:47 +05:30 committed by Tim Abbott
parent 954f605514
commit 5ac72eedd9
3 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
web/styles/modal.css
View File

@ -355,3 +355,20 @@
.modal_text_input {
width: 206px;
}
.modal_password_input {
padding: 4px 6px;
color: hsl(0deg 0% 33%);
border-radius: 4px;
border: 1px solid hsl(0deg 0% 80%);
box-shadow: inset 0 1px 1px hsl(0deg 0% 0% / 7.5%);
transition: border linear 0.2s, box-shadow linear 0.2s;
margin-bottom: 10px;
&:focus {
border-color: hsl(206deg 80% 62% / 80%);
outline: 0;
box-shadow: inset 0 1px 1px hsl(0deg 0% 0% / 7.5%),
0 0 8px hsl(206deg 80% 62% / 60%);
}
}

4
web/templates/dialog_change_password.hbs
View File

@ -1,7 +1,7 @@
<form id="change_password_container">
<div class="field password-div">
<label for="old_password" class="title">{{t "Old password" }}</label>
<input type="password" autocomplete="off" name="old_password" id="old_password" class="w-200 inline-block modal_text_input" value="" />
<input type="password" autocomplete="off" name="old_password" id="old_password" class="w-200 inline-block modal_text_input modal_password_input" value="" />
<i class="fa fa-eye-slash password_visibility_toggle tippy-zulip-tooltip" role="button"></i>
<div class="settings-forgot-password">
<a href="/accounts/password/reset/" class="sea-green" target="_blank" rel="noopener noreferrer">{{t "Forgot it?" }}</a>
@ -9,7 +9,7 @@
</div>
<div class="field password-div">
<label for="new_password" class="title">{{t "New password" }}</label>
<input type="password" autocomplete="new-password" name="new_password" id="new_password" class="w-200 inline-block modal_text_input" value=""
<input type="password" autocomplete="new-password" name="new_password" id="new_password" class="w-200 inline-block modal_text_input modal_password_input" value=""
data-min-length="{{password_min_length}}" data-min-guesses="{{password_min_guesses}}" />
<i class="fa fa-eye-slash password_visibility_toggle tippy-zulip-tooltip" role="button"></i>
<div class="progress inline-block" id="pw_strength">

2
web/templates/settings/api_key_modal.hbs
View File

@ -14,7 +14,7 @@
<p>{{t "Please re-enter your password to confirm your identity." }}</p>
<div class="password-div">
<label for="password">{{t "Your password" }}</label>
<input type="password" autocomplete="off" name="password" id="get_api_key_password" class="modal_text_input" value="" />
<input type="password" autocomplete="off" name="password" id="get_api_key_password" class="modal_text_input modal_password_input" value="" />
<i class="fa fa-eye-slash password_visibility_toggle tippy-zulip-tooltip" role="button"></i>
</div>
<p class="small">