From a208da9c4d022d6aa40880a0aaf7d66d95974b43 Mon Sep 17 00:00:00 2001
From: Lakshay Mittal <lakshaymittal225@gmail.com>
Date: Fri, 31 Mar 2023 12:51:02 +0530
Subject: [PATCH] style: Fix dropdown text alignment by reducing vertical
 padding.

Zulip's select widgets have a 30px height; this comes from Bootstrap
but is also generally nice for visual consistency.

In modals, we use a 15px font-size, instead of the 14px used in the
rest of the app, and in that context, the 4px vertical padding plus
30px fixed height resulted in the text not being vertically aligned.

Fix this by removing that vertical padding; all of our select elements
with these classes appear to position the text in the center of the
dropdown through other CSS mechanisms.
---
 web/styles/modal.css                          | 2 +-
 web/styles/portico/activity.css               | 2 +-
 web/styles/portico/billing.css                | 2 +-
 web/styles/portico/integrations_dev_panel.css | 2 +-
 web/styles/portico/portico_signin.css         | 2 +-
 web/styles/settings.css                       | 2 +-
 web/styles/zulip.css                          | 2 +-
 7 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/web/styles/modal.css b/web/styles/modal.css
index f2b1ec1ef3..7e959a039d 100644
--- a/web/styles/modal.css
+++ b/web/styles/modal.css
@@ -335,7 +335,7 @@
 .modal_select {
     height: 30px;
     width: 220px;
-    padding: 4px 6px;
+    padding: 0 6px;
     color: hsl(0deg 0% 33%);
     border-radius: 4px;
     border: 1px solid hsl(0deg 0% 80%);
diff --git a/web/styles/portico/activity.css b/web/styles/portico/activity.css
index fd8439e502..fae1dce88c 100644
--- a/web/styles/portico/activity.css
+++ b/web/styles/portico/activity.css
@@ -55,7 +55,7 @@ tr.admin td:first-child {
     & select {
         height: 30px;
         width: 220px;
-        padding: 4px 6px;
+        padding: 0 6px;
         font-size: 14px;
         color: hsl(0deg 0% 33%);
         border-radius: 4px;
diff --git a/web/styles/portico/billing.css b/web/styles/portico/billing.css
index 4d90fc15d6..c6bee4b542 100644
--- a/web/styles/portico/billing.css
+++ b/web/styles/portico/billing.css
@@ -374,7 +374,7 @@ input[name="licenses"] {
     & select {
         height: 30px;
         width: 100%;
-        padding: 4px 6px;
+        padding: 0 6px;
         font-size: 14px;
         color: hsl(0deg 0% 33%);
         border-radius: 4px;
diff --git a/web/styles/portico/integrations_dev_panel.css b/web/styles/portico/integrations_dev_panel.css
index 200b65d49f..132bbe8756 100644
--- a/web/styles/portico/integrations_dev_panel.css
+++ b/web/styles/portico/integrations_dev_panel.css
@@ -46,7 +46,7 @@
 
     & select {
         height: 30px;
-        padding: 4px 6px;
+        padding: 0 6px;
         width: 220px;
         font-size: 14px;
         color: hsl(0deg 0% 33%);
diff --git a/web/styles/portico/portico_signin.css b/web/styles/portico/portico_signin.css
index 15c45d3064..08dbe363d8 100644
--- a/web/styles/portico/portico_signin.css
+++ b/web/styles/portico/portico_signin.css
@@ -108,7 +108,7 @@ html {
 
         & select {
             height: 30px;
-            padding: 4px 6px;
+            padding: 0 6px;
             width: 220px;
             font-size: 14px;
             color: hsl(0deg 0% 33%);
diff --git a/web/styles/settings.css b/web/styles/settings.css
index 929fde33b3..64cd4dec11 100644
--- a/web/styles/settings.css
+++ b/web/styles/settings.css
@@ -370,7 +370,7 @@ td .button {
 /* list_select is similar to settings_select, but without the height styling. */
 .settings_select,
 .list_select {
-    padding: 4px 6px;
+    padding: 0 6px;
     color: hsl(0deg 0% 33%);
     border-radius: 4px;
     border: 1px solid hsl(0deg 0% 80%);
diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index ba6c00d1a4..b5b70c3032 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -2477,7 +2477,7 @@ select.custom-expiration-time,
 select.invite-as {
     width: 220px;
     height: 30px;
-    padding: 4px 6px;
+    padding: 0 6px;
     color: hsl(0deg 0% 33%);
     border-radius: 4px;
     border: 1px solid hsl(0deg 0% 80%);