Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

message_row: Allow time row to expand if it needs more width. 

While setting a min-width according to the current width, we allow
the time column to expand if the translated `AM/PM` time needs
more width.
This commit is contained in:
Aman Agrawal 2023-01-31 12:03:21 +00:00 committed by Tim Abbott
parent 68f4071873
commit 2bf47c7d4b
1 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
static/styles/message_row.css
View File

@ -2,11 +2,12 @@ $avatar_column_width: 46px;
$distance_of_text_elements_from_message_box_top: 8.5px;
$distance_of_non_text_elements_from_message_box_top: 6px;
$sender_name_distance_below_flex_center: 3px;
$time_column_min_width: 50px; /* + padding */
.message_row {
.messagebox .messagebox-content {
/* Total 868px
1 56px 2 697px 3 55px 4 60px 5
1 56px 2 697px 3 55px 4 60px(min) 5
1 |‾‾‾‾‾‾‾‾‾‾‾:‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾‾:‾‾‾‾‾‾‾‾‾‾‾‾‾‾:‾‾‾‾‾‾‾‾‾‾‾‾|
| : TEXT : + ⋮ ☆ : 10:00 AM |
| : TEXT : : |
@ -26,10 +27,10 @@ $sender_name_distance_below_flex_center: 3px;
padding-left: 10px;
grid-template-rows: repeat(4, auto);
grid-template-columns: $avatar_column_width auto 55px 60px;
grid-template-columns: $avatar_column_width auto 55px auto;
@media (width < $sm_min) {
grid-template-columns: $avatar_column_width auto max-content 60px;
grid-template-columns: $avatar_column_width auto max-content auto;
}
.message_controls {
@ -64,6 +65,8 @@ $sender_name_distance_below_flex_center: 3px;
line-height: 1;
justify-self: end;
padding-right: 10px;
min-width: $time_column_min_width;
text-align: end;
grid-row-start: 1;
grid-column-start: 4;
position: relative;