Set max text height to prevent overflow (#18862) (#18977)

Sets a max height for review text boxes to prevent a very annoying bug where users cannot access the "submit" button.

Before:
![image](https://user-images.githubusercontent.com/12700993/155253001-e1dab086-aaf3-4338-889d-6a861728274a.png)

After:
![image](https://user-images.githubusercontent.com/12700993/155253144-5b9a3547-9582-412f-867f-41a45a14a0fe.png)

Interestingly, I don't see this bug on Firefox.

Co-authored-by: Kyle D <kdumontnu@gmail.com>
This commit is contained in:
Otto Richter (fnetX) 2022-03-02 21:12:48 +01:00 committed by GitHub
parent a3f72303d1
commit f4b96c1041
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -461,7 +461,7 @@ export function initRepoPullRequestReview() {
(async () => { (async () => {
// the editor's height is too large in some cases, and the panel cannot be scrolled with page now because there is `.repository .diff-detail-box.sticky { position: sticky; }` // the editor's height is too large in some cases, and the panel cannot be scrolled with page now because there is `.repository .diff-detail-box.sticky { position: sticky; }`
// the temporary solution is to make the editor's height smaller (about 4 lines). GitHub also only show 4 lines for default. We can improve the UI (including Dropzone area) in future // the temporary solution is to make the editor's height smaller (about 4 lines). GitHub also only show 4 lines for default. We can improve the UI (including Dropzone area) in future
await createCommentEasyMDE($reviewBox.find('textarea'), {minHeight: '80px'}); await createCommentEasyMDE($reviewBox.find('textarea'), {minHeight: '80px', maxHeight: 'calc(100vh - 360px)'});
initCompImagePaste($reviewBox); initCompImagePaste($reviewBox);
})(); })();
} }