From 26b7e40ac5d152de496cb95949047bf0c169cb0d Mon Sep 17 00:00:00 2001
From: Sahil Batra <sahil@zulip.com>
Date: Tue, 29 Nov 2022 23:31:30 +0530
Subject: [PATCH] invite: Add bootstrap CSS rules to emails textarea in invite
 overlay.

This commit adds required bootstrap CSS rules used for emails
textarea element in invite modal with existing CSS for that
element in zulip.css. We also change the selector to use class
instead of ID such that the dark theme CSS can take precedence
when using dark theme.

This change is done so we can safely remove textarea CSS rules
for bootstrap.css as a part of our process to remove bootstrap
without changing existing design.
---
 static/styles/zulip.css          | 25 ++++++++++++++++++++++++-
 static/templates/invite_user.hbs |  2 +-
 2 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/static/styles/zulip.css b/static/styles/zulip.css
index d10df4f71e..fc737976f7 100644
--- a/static/styles/zulip.css
+++ b/static/styles/zulip.css
@@ -2476,11 +2476,34 @@ div.topic_edit_spinner .loading_indicator_spinner {
     height: 20px;
 }
 
-#invitee_emails {
+textarea.invitee_emails {
     min-height: 40px;
     max-height: 300px;
     width: 96%;
     max-width: 96%;
+
+    color: hsl(0, 0%, 33%);
+    background-color: hsl(0, 0%, 100%);
+    border-radius: 4px;
+    vertical-align: middle;
+    border: 1px solid hsl(0, 0%, 80%);
+    padding: 4px 6px;
+
+    box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075);
+    transition: border linear 0.2s, box-shadow linear 0.2s;
+
+    &:focus {
+        border-color: hsla(206.5, 80%, 62%, 0.8);
+        outline: 0;
+
+        box-shadow: inset 0 1px 1px hsla(0, 0%, 0%, 0.075),
+            0 0 8px hsla(206.5, 80%, 62%, 0.6);
+    }
+
+    &:disabled {
+        cursor: not-allowed;
+        background-color: hsl(0, 0%, 93%);
+    }
 }
 
 #invite-user {
diff --git a/static/templates/invite_user.hbs b/static/templates/invite_user.hbs
index acb4e4d005..f9111d570d 100644
--- a/static/templates/invite_user.hbs
+++ b/static/templates/invite_user.hbs
@@ -14,7 +14,7 @@
                 <div class="input-group">
                     <label for="invitee_emails">{{t "Emails (one on each line or comma-separated)" }}</label>
                     <div>
-                        <textarea rows="2" id="invitee_emails" name="invitee_emails" placeholder="{{t 'One or more email addresses...' }}"></textarea>
+                        <textarea rows="2" id="invitee_emails" name="invitee_emails" class="invitee_emails" placeholder="{{t 'One or more email addresses...' }}"></textarea>
                         {{#if is_admin}}
                         <div id="invite-method-choice">
                             {{t "or" }} <a role="button" tabindex="0" id="generate_multiuse_invite_button">{{t "Generate invite link" }}</a>