css: Make the height of compose buttons steady.

When any stream name includes some other language's letters is scrolled down in 
the recent views, the height of compose-controls bar would change.

Fix this by setting a precise line-height for these elements.

Fixes: #27837.
This commit is contained in:
vighneshbhat9945 2024-01-26 04:46:00 +05:30 committed by GitHub
parent 6781d06988
commit 6d6fa145cc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 1 deletions

View File

@ -16,7 +16,7 @@
& span {
font-size: 1.2em !important;
font-weight: 400;
line-height: 1em;
line-height: var(--line-height-compose-buttons);
}
}
}
@ -53,6 +53,7 @@
border: none;
background: var(--color-compose-embedded-button-background);
border-radius: 3px;
line-height: var(--line-height-compose-buttons);
}
#left_bar_compose_reply_button_big {
@ -93,6 +94,7 @@
#new_conversation_button,
.new_direct_message_button_container {
flex-shrink: 0;
line-height: var(--line-height-compose-buttons);
@media (width < $sm_min) {
/* Override inline style injected by jQuery hide() */

View File

@ -172,6 +172,13 @@ body {
*/
--max-unexpanded-compose-height: 40vh;
/*
Line height of the message buttons in compose box. Here it's necessary
to control this value uniformly and precisely to avoid issues with
layout shifts originating with non-Latin characters in this area.
*/
--line-height-compose-buttons: 20px;
/*
Maximum height of the subscribers list in stream settings so that
it doesn't cause the container to have a second scrollbar.