From c6d975f44d96aede17e298fff1b30e053108734c Mon Sep 17 00:00:00 2001
From: adnan-td <generaladnan139@gmail.com>
Date: Mon, 1 Jul 2024 00:04:49 +0530
Subject: [PATCH] compose: Align multi-line text in dropdowns.

Using flexbox to left-align icon with the text
on the first line.

Fixes part of #30469.
---
 web/styles/zulip.css | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/web/styles/zulip.css b/web/styles/zulip.css
index d8623e5c73..a0d01db897 100644
--- a/web/styles/zulip.css
+++ b/web/styles/zulip.css
@@ -2285,9 +2285,10 @@ body:not(.hide-left-sidebar) {
 }
 
 .dropdown-list-container .dropdown-list .dropdown-list-item-common-styles {
-    display: block;
+    display: flex;
     color: var(--color-dropdown-item);
     padding: 3px 10px 3px 8px;
+    gap: 4px;
     font-weight: 400;
     line-height: 20px;
     white-space: normal;
@@ -2299,6 +2300,10 @@ body:not(.hide-left-sidebar) {
         padding-right: 2px;
     }
 
+    .zulip-icon {
+        margin-top: 2px;
+    }
+
     &:focus,
     &:hover {
         color: var(--color-dropdown-item);