From 8b7a911b0e38400e794d26c04b885bdc0db7ecc5 Mon Sep 17 00:00:00 2001
From: Sahil Batra <sahil@zulip.com>
Date: Tue, 10 Jan 2023 16:03:08 +0530
Subject: [PATCH] settings: Remove form-horizontal class from settings
 template.

This commit removes form-horizontal class from form elements
in user profile, org profile, org settings and org permission
pages. We also add margin-bottom property for select elements
in this page.

We can safely remove this class since vertical-align property
is already present due to other bootstrap CSS.
And margin-bottom property for checkbox inputs are added by
bootstrap and for text inputs it is handled in
app_components.css.

The display property for inputs other than checkbox and select
elements is set to inline-block by other bootstrap CSS.
For checkbox-type inputs browser sets display property to
inline-block but it is eventually computed to "block" as the
float property is set to left and so it is not required to
set display property for checkbox type inputs.

We have added CSS for select elements in settings.css which can
be removed later once we remove bootstrap for select elements
completely.
---
 static/styles/settings.css                            | 11 +++++++++++
 .../settings/organization_permissions_admin.hbs       |  2 +-
 .../templates/settings/organization_profile_admin.hbs |  2 +-
 .../settings/organization_settings_admin.hbs          |  2 +-
 static/templates/settings/profile_settings.hbs        |  4 ++--
 5 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/static/styles/settings.css b/static/styles/settings.css
index 72072cca0c..fb07b72509 100644
--- a/static/styles/settings.css
+++ b/static/styles/settings.css
@@ -456,6 +456,17 @@ input[type="checkbox"] {
     margin-top: 10px;
 }
 
+#organization-profile,
+#organization-settings,
+#organization-permissions,
+#profile-settings {
+    select,
+    input {
+        /* Override undesired Bootstrap default. */
+        margin-bottom: 0;
+    }
+}
+
 #id_org_profile_preview {
     margin-bottom: 20px;
     display: inline-flex;
diff --git a/static/templates/settings/organization_permissions_admin.hbs b/static/templates/settings/organization_permissions_admin.hbs
index 6be4901446..2c6ee3c159 100644
--- a/static/templates/settings/organization_permissions_admin.hbs
+++ b/static/templates/settings/organization_permissions_admin.hbs
@@ -1,5 +1,5 @@
 <div id="organization-permissions" data-name="organization-permissions" class="settings-section">
-    <form class="form-horizontal admin-realm-form org-permissions-form">
+    <form class="admin-realm-form org-permissions-form">
 
         <div id="org-join-settings" class="settings-subsection-parent">
             <div class="subsection-header">
diff --git a/static/templates/settings/organization_profile_admin.hbs b/static/templates/settings/organization_profile_admin.hbs
index be41a743d4..586de8cde9 100644
--- a/static/templates/settings/organization_profile_admin.hbs
+++ b/static/templates/settings/organization_profile_admin.hbs
@@ -1,5 +1,5 @@
 <div id="organization-profile" data-name="organization-profile" class="settings-section">
-    <form class="form-horizontal admin-realm-form org-profile-form">
+    <form class="admin-realm-form org-profile-form">
         <div class="alert" id="admin-realm-deactivation-status"></div>
 
         <div id="org-org-profile" class="settings-subsection-parent">
diff --git a/static/templates/settings/organization_settings_admin.hbs b/static/templates/settings/organization_settings_admin.hbs
index 16a3272260..bc637724c7 100644
--- a/static/templates/settings/organization_settings_admin.hbs
+++ b/static/templates/settings/organization_settings_admin.hbs
@@ -1,5 +1,5 @@
 <div id="organization-settings" data-name="organization-settings" class="settings-section">
-    <form class="form-horizontal admin-realm-form org-settings-form">
+    <form class="admin-realm-form org-settings-form">
 
         <div id="org-notifications" class="settings-subsection-parent">
             <div class="subsection-header">
diff --git a/static/templates/settings/profile_settings.hbs b/static/templates/settings/profile_settings.hbs
index 4cc6499a7f..030749614e 100644
--- a/static/templates/settings/profile_settings.hbs
+++ b/static/templates/settings/profile_settings.hbs
@@ -15,7 +15,7 @@
                     </div>
                 </div>
 
-                <form class="form-horizontal timezone-setting-form">
+                <form class="timezone-setting-form">
                     <div class="input-group grid">
                         <label for="timezone" class="dropdown-title inline-block">{{t "Time zone" }}</label>
                         <div class="alert-notification timezone-setting-status"></div>
@@ -33,7 +33,7 @@
                     </div>
                 </form>
 
-                <form class="form-horizontal custom-profile-fields-form grid"></form>
+                <form class="custom-profile-fields-form grid"></form>
             </div>
         </div>