From 1c6bed55e4e800b5bad7150f6bdd274cd7f6504e Mon Sep 17 00:00:00 2001
From: Sahil Batra <sahil@zulip.com>
Date: Mon, 27 Mar 2023 13:54:27 +0530
Subject: [PATCH] modals: Add modal_text_input class to text inputs.

This commit adds modal_text_input class to text inputs
in modals to set width of them as set by bootstrap.
This class is used to set the width of inputs to 206px,
as we will be removing the boostrap rule which sets width
of the input in further commits.
---
 web/styles/modal.css                                      | 4 ++++
 web/templates/change_email_modal.hbs                      | 2 +-
 web/templates/dialog_change_password.hbs                  | 4 ++--
 web/templates/embedded_bot_config_item.hbs                | 2 +-
 web/templates/move_topic_to_stream.hbs                    | 2 +-
 web/templates/settings/add_alert_word.hbs                 | 2 +-
 web/templates/settings/add_emoji.hbs                      | 2 +-
 web/templates/settings/add_new_bot_form.hbs               | 4 ++--
 .../settings/add_new_custom_profile_field_form.hbs        | 4 ++--
 web/templates/settings/add_user_group_modal.hbs           | 2 +-
 web/templates/settings/api_key_modal.hbs                  | 2 +-
 web/templates/settings/custom_user_profile_field.hbs      | 8 ++++----
 web/templates/settings/edit_bot_form.hbs                  | 6 +++---
 web/templates/settings/edit_custom_profile_field_form.hbs | 4 ++--
 web/templates/settings/edit_embedded_bot_service.hbs      | 2 +-
 web/templates/settings/edit_outgoing_webhook_service.hbs  | 2 +-
 web/templates/settings/realm_domains_modal.hbs            | 2 +-
 .../stream_settings/change_stream_info_modal.hbs          | 2 +-
 .../user_group_settings/change_user_group_info_modal.hbs  | 2 +-
 web/templates/user_profile_modal.hbs                      | 2 +-
 20 files changed, 32 insertions(+), 28 deletions(-)

diff --git a/web/styles/modal.css b/web/styles/modal.css
index 8b753369a0..8cc7676361 100644
--- a/web/styles/modal.css
+++ b/web/styles/modal.css
@@ -347,3 +347,7 @@
         background-color: hsl(0deg 0% 90%);
     }
 }
+
+.modal_text_input {
+    width: 206px;
+}
diff --git a/web/templates/change_email_modal.hbs b/web/templates/change_email_modal.hbs
index c30e5ecf62..de2f25c73b 100644
--- a/web/templates/change_email_modal.hbs
+++ b/web/templates/change_email_modal.hbs
@@ -1,4 +1,4 @@
 <form id="change_email_form" class="new-style">
     <label for="email">{{t "New email" }}</label>
-    <input type="text" name="email" value="{{delivery_email}}" autocomplete="off" spellcheck="false" autofocus="autofocus"/>
+    <input type="text" name="email" class="modal_text_input" value="{{delivery_email}}" autocomplete="off" spellcheck="false" autofocus="autofocus"/>
 </form>
diff --git a/web/templates/dialog_change_password.hbs b/web/templates/dialog_change_password.hbs
index 343b46a30f..02eb1aef71 100644
--- a/web/templates/dialog_change_password.hbs
+++ b/web/templates/dialog_change_password.hbs
@@ -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" value="" />
+        <input type="password" autocomplete="off" name="old_password" id="old_password" class="w-200 inline-block modal_text_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" value=""
+        <input type="password" autocomplete="new-password" name="new_password" id="new_password" class="w-200 inline-block modal_text_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">
diff --git a/web/templates/embedded_bot_config_item.hbs b/web/templates/embedded_bot_config_item.hbs
index f61232837e..4050216ea4 100644
--- a/web/templates/embedded_bot_config_item.hbs
+++ b/web/templates/embedded_bot_config_item.hbs
@@ -1,5 +1,5 @@
 <div class="input-group" name="{{botname}}" id="{{botname}}_{{key}}">
     <label for="{{botname}}_{{key}}_input">{{key}}</label>
-    <input type="text" name="{{key}}" id="{{botname}}_{{key}}_input"
+    <input type="text" name="{{key}}" id="{{botname}}_{{key}}_input" class="modal_text_input"
       maxlength=1000 placeholder="{{value}}" value="" />
 </div>
diff --git a/web/templates/move_topic_to_stream.hbs b/web/templates/move_topic_to_stream.hbs
index e8ca28bd03..7b8cd7c21a 100644
--- a/web/templates/move_topic_to_stream.hbs
+++ b/web/templates/move_topic_to_stream.hbs
@@ -11,7 +11,7 @@
               list_placeholder=(t 'Filter streams')}}
         </div>
         <i class="fa fa-angle-right" aria-hidden="true"></i>
-        <input name="new_topic_name" type="text" class="inline_topic_edit" autocomplete="off" value="{{topic_name}}" {{#if disable_topic_input}}disabled{{/if}} />
+        <input name="new_topic_name" type="text" class="inline_topic_edit modal_text_input" autocomplete="off" value="{{topic_name}}" {{#if disable_topic_input}}disabled{{/if}} />
         <input name="old_topic_name" type="hidden" class="inline_topic_edit" value="{{topic_name}}" />
         <input name="current_stream_id" type="hidden" value="{{current_stream_id}}" />
         {{#if from_message_actions_popover}}
diff --git a/web/templates/settings/add_alert_word.hbs b/web/templates/settings/add_alert_word.hbs
index 65b382b1aa..28e8bf2eee 100644
--- a/web/templates/settings/add_alert_word.hbs
+++ b/web/templates/settings/add_alert_word.hbs
@@ -1,4 +1,4 @@
 <form id="add-alert-word-form">
     <label for="add-alert-word-name">{{t "Alert word" }}</label>
-    <input type="text" name="alert-word-name" id="add-alert-word-name" class="required" maxlength=100 placeholder="{{t 'Alert word' }}" value="" />
+    <input type="text" name="alert-word-name" id="add-alert-word-name" class="required modal_text_input" maxlength=100 placeholder="{{t 'Alert word' }}" value="" />
 </form>
diff --git a/web/templates/settings/add_emoji.hbs b/web/templates/settings/add_emoji.hbs
index 60aaf49bf0..facb882de8 100644
--- a/web/templates/settings/add_emoji.hbs
+++ b/web/templates/settings/add_emoji.hbs
@@ -12,6 +12,6 @@
     <div id="emoji_file_input_error" class="text-error"></div>
     <div class="emoji_name_input">
         <label for="emoji_name">{{t "Emoji name" }}</label>
-        <input type="text" name="name" id="emoji_name" placeholder="{{t 'leafy green vegetable' }}" />
+        <input type="text" name="name" id="emoji_name" class="modal_text_input" placeholder="{{t 'leafy green vegetable' }}" />
     </div>
 </form>
diff --git a/web/templates/settings/add_new_bot_form.hbs b/web/templates/settings/add_new_bot_form.hbs
index 44ff274021..f6d7e92fd7 100644
--- a/web/templates/settings/add_new_bot_form.hbs
+++ b/web/templates/settings/add_new_bot_form.hbs
@@ -23,13 +23,13 @@
         </div>
         <div class="input-group">
             <label for="create_bot_name">{{t "Full name" }}</label>
-            <input type="text" name="bot_name" id="create_bot_name" class="required"
+            <input type="text" name="bot_name" id="create_bot_name" class="required modal_text_input"
               maxlength=100 placeholder="{{t 'Cookie Bot' }}" value="" />
             <div><label for="create_bot_name" generated="true" class="text-error"></label></div>
         </div>
         <div class="input-group">
             <label for="bot_short_name">{{t "Bot email (a-z, 0-9, and dashes only)" }}</label>
-            <input type="text" name="bot_short_name" id="create_bot_short_name" class="required bot_local_part"
+            <input type="text" name="bot_short_name" id="create_bot_short_name" class="required bot_local_part modal_text_input"
               placeholder="{{t 'cookie' }}" value="" />
             -bot@{{ realm_bot_domain }}
             <div>
diff --git a/web/templates/settings/add_new_custom_profile_field_form.hbs b/web/templates/settings/add_new_custom_profile_field_form.hbs
index 2026eec11d..558d5d3e5e 100644
--- a/web/templates/settings/add_new_custom_profile_field_form.hbs
+++ b/web/templates/settings/add_new_custom_profile_field_form.hbs
@@ -19,11 +19,11 @@
         </div>
         <div class="input-group">
             <label for="profile_field_name" >{{t "Label" }}</label>
-            <input type="text" id="profile_field_name" name="name" autocomplete="off" maxlength="40" />
+            <input type="text" id="profile_field_name" class="modal_text_input" name="name" autocomplete="off" maxlength="40" />
         </div>
         <div class="input-group">
             <label for="profile_field_hint" >{{t "Hint (up to 80 characters)" }}</label>
-            <input type="text" id="profile_field_hint" name="hint" autocomplete="off" maxlength="80" />
+            <input type="text" id="profile_field_hint" class="modal_text_input" name="hint" autocomplete="off" maxlength="80" />
             <div class="alert" id="admin-profile-field-hint-status"></div>
         </div>
         <div class="input-group" id="profile_field_choices_row">
diff --git a/web/templates/settings/add_user_group_modal.hbs b/web/templates/settings/add_user_group_modal.hbs
index 8457ce5332..179775bcfe 100644
--- a/web/templates/settings/add_user_group_modal.hbs
+++ b/web/templates/settings/add_user_group_modal.hbs
@@ -1,7 +1,7 @@
 <form id="add-user-group-form">
     <div>
         <label for="user_group_name">{{t "Name" }}</label>
-        <input type="text" name="name" id="user_group_name" maxlength="100" placeholder="{{t 'marketing' }}" />
+        <input type="text" name="name" id="user_group_name" class="modal_text_input" maxlength="100" placeholder="{{t 'marketing' }}" />
     </div>
     <div>
         <label for="user_group_description">{{t "Description" }}</label>
diff --git a/web/templates/settings/api_key_modal.hbs b/web/templates/settings/api_key_modal.hbs
index 1546c26d52..dde209cc64 100644
--- a/web/templates/settings/api_key_modal.hbs
+++ b/web/templates/settings/api_key_modal.hbs
@@ -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" value="" />
+                            <input type="password" autocomplete="off" name="password" id="get_api_key_password" class="modal_text_input" value="" />
                             <i class="fa fa-eye-slash password_visibility_toggle tippy-zulip-tooltip" role="button"></i>
                         </div>
                         <p class="small">
diff --git a/web/templates/settings/custom_user_profile_field.hbs b/web/templates/settings/custom_user_profile_field.hbs
index 3bfd531bd3..9352cf935f 100644
--- a/web/templates/settings/custom_user_profile_field.hbs
+++ b/web/templates/settings/custom_user_profile_field.hbs
@@ -17,15 +17,15 @@
             <div class="input" contenteditable="true"></div>
         </div>
         {{else if is_date_field }}
-        <input class="custom_user_field_value datepicker" data-field-id="{{ field.id }}" type="text"
+        <input class="custom_user_field_value datepicker modal_text_input" data-field-id="{{ field.id }}" type="text"
           value="{{ field_value.value }}" />
         <span class="remove_date"><i class="fa fa-close"></i></span>
         {{else if is_url_field }}
-        <input class="custom_user_field_value" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="2048" />
+        <input class="custom_user_field_value modal_text_input" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="2048" />
         {{else if is_pronouns_field}}
-        <input class="custom_user_field_value pronouns_type_field" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="50" />
+        <input class="custom_user_field_value pronouns_type_field modal_text_input" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="50" />
         {{else}}
-        <input class="custom_user_field_value" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="50" />
+        <input class="custom_user_field_value modal_text_input" type="{{ field_type }}" value="{{ field_value.value }}" maxlength="50" />
         {{/if}}
     </div>
 </div>
diff --git a/web/templates/settings/edit_bot_form.hbs b/web/templates/settings/edit_bot_form.hbs
index f56d02dd60..f74a1f5b51 100644
--- a/web/templates/settings/edit_bot_form.hbs
+++ b/web/templates/settings/edit_bot_form.hbs
@@ -2,16 +2,16 @@
     <form class="new-style edit_bot_form name-setting">
         <div class="input-group name_change_container">
             <label for="edit_bot_full_name">{{t "Full name" }}</label>
-            <input type="text" autocomplete="off" name="full_name" id="edit_bot_full_name" value="{{ full_name }}" />
+            <input type="text" autocomplete="off" name="full_name" id="edit_bot_full_name" class="modal_text_input" value="{{ full_name }}" />
         </div>
         <input type="hidden" name="is_full_name" value="true" />
         <div class="input-group email_change_container">
             <label for="email">{{t "Email" }}</label>
-            <input type="text" autocomplete="off" name="email" value="{{ email }}" readonly/>
+            <input type="text" autocomplete="off" name="email" class="modal_text_input" value="{{ email }}" readonly/>
         </div>
         <div class="input-group user_id_container">
             <label for="user_id">{{t "User ID" }}</label>
-            <input type="text" autocomplete="off" name="user_id" value="{{ user_id }}" readonly/>
+            <input type="text" autocomplete="off" name="user_id" class="modal_text_input" value="{{ user_id }}" readonly/>
         </div>
         <div class="input-group">
             <label class="input-label" for="bot-role-select">{{t 'Role' }}
diff --git a/web/templates/settings/edit_custom_profile_field_form.hbs b/web/templates/settings/edit_custom_profile_field_form.hbs
index d97fb1ea7e..5b44626888 100644
--- a/web/templates/settings/edit_custom_profile_field_form.hbs
+++ b/web/templates/settings/edit_custom_profile_field_form.hbs
@@ -2,11 +2,11 @@
 <form class="name-setting profile-field-form new-style" id="edit-custom-profile-field-form-{{id}}">
     <div class="input-group">
         <label for="name">{{t "Label" }}</label>
-        <input type="text" name="name" value="{{ name }}" maxlength="40" />
+        <input type="text" name="name" class="modal_text_input" value="{{ name }}" maxlength="40" />
     </div>
     <div class="input-group hint_change_container">
         <label for="hint">{{t "Hint" }}</label>
-        <input type="text" name="hint" value="{{ hint }}" maxlength="80" />
+        <input type="text" name="hint" class="modal_text_input" value="{{ hint }}" maxlength="80" />
     </div>
     {{#if is_select_field }}
     <div class="input-group">
diff --git a/web/templates/settings/edit_embedded_bot_service.hbs b/web/templates/settings/edit_embedded_bot_service.hbs
index a4edd3a2f3..5b8a9e74b5 100644
--- a/web/templates/settings/edit_embedded_bot_service.hbs
+++ b/web/templates/settings/edit_embedded_bot_service.hbs
@@ -2,7 +2,7 @@
     {{#each service.config_data}}
         <div class="input-group">
             <label for="embedded_bot_{{@key}}_edit">{{@key}}</label>
-            <input type="text" name="{{@key}}" id="embedded_bot_{{@key}}_edit"
+            <input type="text" name="{{@key}}" id="embedded_bot_{{@key}}_edit" class="modal_text_input"
               maxlength=1000 value="{{this}}" />
         </div>
     {{/each}}
diff --git a/web/templates/settings/edit_outgoing_webhook_service.hbs b/web/templates/settings/edit_outgoing_webhook_service.hbs
index 0759e9da60..58dd1385d1 100644
--- a/web/templates/settings/edit_outgoing_webhook_service.hbs
+++ b/web/templates/settings/edit_outgoing_webhook_service.hbs
@@ -1,6 +1,6 @@
 <div class="input-group">
     <label for="edit_service_base_url">{{t "Endpoint URL" }}</label>
-    <input id="edit_service_base_url" type="text" name="service_payload_url" class="edit_service_base_url required" value="{{service.base_url}}" maxlength=2083 />
+    <input id="edit_service_base_url" type="text" name="service_payload_url" class="edit_service_base_url required modal_text_input"value="{{service.base_url}}" maxlength=2083 />
     <div><label for="edit_service_base_url" generated="true" class="text-error"></label></div>
 </div>
 <div class="input-group">
diff --git a/web/templates/settings/realm_domains_modal.hbs b/web/templates/settings/realm_domains_modal.hbs
index fee525aa96..b54f765f8d 100644
--- a/web/templates/settings/realm_domains_modal.hbs
+++ b/web/templates/settings/realm_domains_modal.hbs
@@ -8,7 +8,7 @@
     </tbody>
     <tfoot>
         <tr id="add-realm-domain-widget">
-            <td><input type="text" class="new-realm-domain" placeholder="acme.com" /></td>
+            <td><input type="text" class="new-realm-domain modal_text_input" placeholder="acme.com" /></td>
             <td>
                 <label class="checkbox">
                     <input type="checkbox" class="new-realm-domain-allow-subdomains" />
diff --git a/web/templates/stream_settings/change_stream_info_modal.hbs b/web/templates/stream_settings/change_stream_info_modal.hbs
index 482d2141a0..ceba4292b1 100644
--- a/web/templates/stream_settings/change_stream_info_modal.hbs
+++ b/web/templates/stream_settings/change_stream_info_modal.hbs
@@ -2,7 +2,7 @@
     <label for="change_stream_name">
         {{t 'Stream name' }}
     </label>
-    <input type="text" id="change_stream_name" value="{{ stream_name }}" maxlength="{{ max_stream_name_length }}" />
+    <input type="text" id="change_stream_name" class="modal_text_input" value="{{ stream_name }}" maxlength="{{ max_stream_name_length }}" />
 </div>
 <div>
     <label for="change_stream_description">
diff --git a/web/templates/user_group_settings/change_user_group_info_modal.hbs b/web/templates/user_group_settings/change_user_group_info_modal.hbs
index da930524d5..828e437513 100644
--- a/web/templates/user_group_settings/change_user_group_info_modal.hbs
+++ b/web/templates/user_group_settings/change_user_group_info_modal.hbs
@@ -2,7 +2,7 @@
     <label for="change_user_group_name">
         {{t 'User group name' }}
     </label>
-    <input type="text" id="change_user_group_name" value="{{ group_name }}" />
+    <input type="text" id="change_user_group_name" class="modal_text_input" value="{{ group_name }}" />
 </div>
 <div>
     <label for="change_user_group_description">
diff --git a/web/templates/user_profile_modal.hbs b/web/templates/user_profile_modal.hbs
index 96758a76db..8da4d6151c 100644
--- a/web/templates/user_profile_modal.hbs
+++ b/web/templates/user_profile_modal.hbs
@@ -92,7 +92,7 @@
                             <div class="header-section">
                                 <h3 class="stream-list-header">{{t 'Subscribed streams' }}</h3>
                             </div>
-                            <input type="text" class="stream-search" placeholder="{{t 'Filter streams' }}" />
+                            <input type="text" class="stream-search modal_text_input" placeholder="{{t 'Filter streams' }}" />
                             <button type="button" class="clear_search_button" id="clear_stream_search">
                                 <i class="fa fa-remove" aria-hidden="true"></i>
                             </button>