Change conversation height calculation from Javascript to CSS

[marc-farre]

The conversation HTML element height is calculated in real time with JavaScript:

With this function: https://github.com/humhub/mail/blob/master/resources/js/humhub.mail.ConversationView.js#L378-L404

This function could be removed if we have the following LESS code:

#mail-conversation-root > .panel {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 165px); // 165px depends on the top menu and should be adpated for different screen width using the @media rule
    
    > .panel-body {
        flex: 1;
        min-height: 150px;
        overflow: auto;
    }

    .mail-message-form {
        .content-create-input-group {
            position: relative;
        }
    }
}

For testing, we need to overwrite existing LESS code which should be removed:

    .conversation-entry-list {
        max-height: none;
        height: auto;
        overflow: unset;
    }

    .mail-message-form {
        position: static;
    }

Benefits:

• More reliable
• Instant height resizing when adding new lines in the reply form
• Reduced processor resource consumption
• possibility to change the height calculation in custom theme by overwriting the height: calc(100vh - 165px);

This would solve the issue we currently have with the Clean Theme on mobile, where the bottom bar is displayed on top of the reply form.

[marc-farre]

@luke- would you accept such a PR?

[marc-farre]

See humhub/humhub#7131 for the CSS height calculation of #mail-conversation-root > .panel

[luke-]

@marc-farre Thanks, looks good for me.

@yurabakhtin Can you please check?

[marc-farre]

@yurabakhtin I'll send a PR so you can test the changes, but after creating the --fixed-header-height and --fixed-footer-height CSS variables in HumHub core (see humhub/humhub#7131).

So, this PR will change HumHub minimum version to HumHub 1.17.

[marc-farre]

@luke- @yurabakhtin PR #407