Skip to content

Commit

Permalink
Fix the editor height in review box (#19003) (#19147)
Browse files Browse the repository at this point in the history
Backport #19003

Fix the height problem in  #18862 (comment)

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
  • Loading branch information
zeripath and wxiaoguang authored Mar 20, 2022
1 parent 45c836b commit ea56bdc
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 1 deletion.
3 changes: 2 additions & 1 deletion web_src/js/features/repo-issue.js
Original file line number Diff line number Diff line change
Expand Up @@ -461,7 +461,8 @@ export function initRepoPullRequestReview() {
(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 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', maxHeight: 'calc(100vh - 360px)'});
// EasyMDE's options can not handle minHeight & maxHeight together correctly, we have to set max-height for .CodeMirror-scroll in CSS.
await createCommentEasyMDE($reviewBox.find('textarea'), {minHeight: '80px'});
initCompImagePaste($reviewBox);
})();
}
Expand Down
7 changes: 7 additions & 0 deletions web_src/less/_review.less
Original file line number Diff line number Diff line change
Expand Up @@ -197,6 +197,13 @@ a.blob-excerpt:hover {
color: #fff;
}

// See the comment of createCommentEasyMDE() for the review editor
// EasyMDE's options can not handle minHeight & maxHeight together correctly, we have to set minHeight in JS code
#review-box .CodeMirror-scroll {
min-height: 80px;
max-height: calc(100vh - 360px);
}

@media @mediaSm {
#review-box > .menu {
> .ui.segment {
Expand Down

0 comments on commit ea56bdc

Please sign in to comment.