compose: Align multi-line text in dropdowns.

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

Fixes part of #30469.
This commit is contained in:
adnan-td 2024-07-01 00:04:49 +05:30 committed by Tim Abbott
parent b705c0ef27
commit c6d975f44d
1 changed files with 6 additions and 1 deletions

View File

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