Fix sizing for the video and chat areas to not extend below the fold

[dori4n]

From Discord:

Currently, the channel page elements that contain the video and chat area extend below the fold and other alignment and sizing issues present, depending on window or screen size. The most crucial and problematic part of this is that the chat input field would end up below the fold, and that's kinda bad. Most of that can be fixed with simple CSS. Using the following user CSS fixes most of the problems in the current production version:

#video-column, #chat-column
{
    dispay: block;
    padding-bottom: 0;
    margin-bottom: 15px;
}
#video-column
{
    height: 50vh;
}
#chat-column
{
    height: calc(50vh - 110px);
}
#chat-column .chat-flex, #chat-column .chat-absolute
{
    height: 100%;
}
#chat-column #chat
{
    max-height: initial; /* better to just get rid of this where it's set to 400px instead */
}
@media screen and (min-width: 992px)
{
    #video-column, #chat-column
    {
        height: calc(100vh - 87px);
    }
}
#video-column .card, #video-column .card-body, #video-column .card-body .embed-responsive, #video-column video
{
    display: block;
    height:  100%;
}
#video-column .card-body .embed-responsive-16by9:before
{
    display: none;
}
#video-column .card-body .embed-responsive-16by9
{
    display: block;
    padding: 0;
    height: calc(100% - 110px);
    width: 100%;
}

One slight issue remains, and to avoid that going funny, it'd be good to wrap the actual stream title in a span and turn word wrapping off with

#video-column .card-header h5 > span
{
    white-space: nowrap;
    text-overflow: ellipsis;
}

Probably best to figure out a way to cut it off and add three dots at the end if it's too long to be in view and turn it into a marquee when you hover over it with the mouse or tap on it (mobile devices). But there's no CSS only solution for that, and I couldn't be bothered (mostly, because there are no titles that long that break at a sensible browser window size, yet).

I don't have a local test environment, and I'm not that familiar with the structure of your CSS rules, so this is not a pull request. It should be trivial for someone who does to adopt and test these changes, though.

[clone1018]

Removing from the Milestone, I want to have this in ASAP -- but it is not required for launch.