From 48dec700997876877e27c6beba4684bd9aa8a461 Mon Sep 17 00:00:00 2001
From: Sahil Batra <sahil@zulip.com>
Date: Tue, 10 Jan 2023 14:53:01 +0530
Subject: [PATCH] invite: Remove form-horizontal class from invite modal.

This commit removes form-horizontal class from invite_user
template. We can safely remove this class as vertical-align
property is already handled for input and select elements
by other bootstrap CSS.

For checkbox type inputs, the display property is already
set to inline-block by browser for all input elements but
it is eventually computed to "block" since float property
for this element is set to left. So, setting display
property is not necessary for checkbox input.

We add margin-bottom property CSS for now and that can
eventually be removed when we remove bootstrap CSS for
these elements completely.
---
 static/styles/zulip.css          | 6 ++++++
 static/templates/invite_user.hbs | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/static/styles/zulip.css b/static/styles/zulip.css
index df06dd90a5..7958c6ae36 100644
--- a/static/styles/zulip.css
+++ b/static/styles/zulip.css
@@ -2480,6 +2480,12 @@ textarea.invitee_emails {
     .invite-stream-controls {
         margin-top: 5px;
     }
+
+    /* Override undesired Bootstrap defaults. */
+    select,
+    input {
+        margin-bottom: 0;
+    }
 }
 
 #invite_status {
diff --git a/static/templates/invite_user.hbs b/static/templates/invite_user.hbs
index f9111d570d..0c1ca80e41 100644
--- a/static/templates/invite_user.hbs
+++ b/static/templates/invite_user.hbs
@@ -5,7 +5,7 @@
             <button type="button" class="exit" aria-label="{{t 'Close' }}"><span aria-hidden="true">&times;</span></button>
             <h3 id="invite-user-label">{{t "Invite users to Zulip" }}</h3>
         </div>
-        <form id="invite_user_form" class="form-horizontal">{{ csrf_input }}
+        <form id="invite_user_form">{{ csrf_input }}
             <div class="modal-body" data-simplebar data-simplebar-auto-hide="false">
                 <div class="alert" id="invite_status"></div>
                 {{#if development_environment}}