Fix chat width resizing when window is very thin

When the window resized to a small width, the chat header buttons would wrap to the next line, but would inline with the chat box itself making it resize to unreadable widths.
Changing the header to flex with some minor adjustments prevents the inline wrapping thus the chatbox retains it's intended width.
This commit is contained in:
Techanon 2021-10-31 13:49:54 -05:00 committed by Calvin Montgomery
parent 7c3f3070f9
commit ab8faf7c99
1 changed files with 12 additions and 1 deletions

View File

@ -28,6 +28,11 @@
padding-right: 5px; padding-right: 5px;
} }
#usercount {
white-space: nowrap;
flex-grow: 2;
}
#userlist { #userlist {
width: 120px; width: 120px;
float: left; float: left;
@ -90,6 +95,12 @@
font-weight: bold; font-weight: bold;
} }
#chatheader {
display: flex;
flex-wrap: wrap;
align-items: center;
}
#chatheader > p, #videowrap-header { #chatheader > p, #videowrap-header {
margin: 0; margin: 0;
} }
@ -582,7 +593,7 @@ table td {
} }
#userlisttoggle { #userlisttoggle {
padding-top: 2px; padding-bottom: 2px;
} }
.queue_entry { .queue_entry {