mirror of https://github.com/go-gitea/gitea.git
Make the height of the editor in Review Box smaller (4 lines as GitHub) (#18319)
And shrink the height of Dropzone.
This commit is contained in:
parent
9dcf0bf6ec
commit
11b4827791
|
@ -50,9 +50,10 @@ export async function importEasyMDE() {
|
||||||
/**
|
/**
|
||||||
* create an EasyMDE editor for comment
|
* create an EasyMDE editor for comment
|
||||||
* @param textarea jQuery or HTMLElement
|
* @param textarea jQuery or HTMLElement
|
||||||
|
* @param easyMDEOptions the options for EasyMDE
|
||||||
* @returns {null|EasyMDE}
|
* @returns {null|EasyMDE}
|
||||||
*/
|
*/
|
||||||
export async function createCommentEasyMDE(textarea) {
|
export async function createCommentEasyMDE(textarea, easyMDEOptions = {}) {
|
||||||
if (textarea instanceof jQuery) {
|
if (textarea instanceof jQuery) {
|
||||||
textarea = textarea[0];
|
textarea = textarea[0];
|
||||||
}
|
}
|
||||||
|
@ -61,6 +62,7 @@ export async function createCommentEasyMDE(textarea) {
|
||||||
}
|
}
|
||||||
|
|
||||||
const EasyMDE = await importEasyMDE();
|
const EasyMDE = await importEasyMDE();
|
||||||
|
|
||||||
const easyMDE = new EasyMDE({
|
const easyMDE = new EasyMDE({
|
||||||
autoDownloadFontAwesome: false,
|
autoDownloadFontAwesome: false,
|
||||||
element: textarea,
|
element: textarea,
|
||||||
|
@ -104,8 +106,7 @@ export async function createCommentEasyMDE(textarea) {
|
||||||
className: 'fa fa-file',
|
className: 'fa fa-file',
|
||||||
title: 'Revert to simple textarea',
|
title: 'Revert to simple textarea',
|
||||||
},
|
},
|
||||||
],
|
], ...easyMDEOptions});
|
||||||
});
|
|
||||||
const inputField = easyMDE.codemirror.getInputField();
|
const inputField = easyMDE.codemirror.getInputField();
|
||||||
inputField.classList.add('js-quick-submit');
|
inputField.classList.add('js-quick-submit');
|
||||||
easyMDE.codemirror.setOption('extraKeys', {
|
easyMDE.codemirror.setOption('extraKeys', {
|
||||||
|
|
|
@ -459,7 +459,9 @@ export function initRepoPullRequestReview() {
|
||||||
const $reviewBox = $('.review-box');
|
const $reviewBox = $('.review-box');
|
||||||
if ($reviewBox.length === 1) {
|
if ($reviewBox.length === 1) {
|
||||||
(async () => {
|
(async () => {
|
||||||
await createCommentEasyMDE($reviewBox.find('textarea'));
|
// 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'});
|
||||||
initCompImagePaste($reviewBox);
|
initCompImagePaste($reviewBox);
|
||||||
})();
|
})();
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,16 @@
|
||||||
.dropzone {
|
.ui .field {
|
||||||
border: 2px dashed var(--color-secondary) !important;
|
.dropzone {
|
||||||
background: none !important;
|
border: 2px dashed var(--color-secondary);
|
||||||
box-shadow: none !important;
|
background: none;
|
||||||
padding: 0 !important;
|
box-shadow: none;
|
||||||
min-height: 5rem !important;
|
padding: 0;
|
||||||
border-radius: 4px !important;
|
border-radius: 4px;
|
||||||
|
min-height: 0;
|
||||||
|
margin-top: -1em; // we have another `field` above, it's usually an EasyMDE editor with "status bar", so we do not need the space above.
|
||||||
|
.dz-message {
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.dropzone .dz-button {
|
.dropzone .dz-button {
|
||||||
|
|
Loading…
Reference in New Issue