mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-10-01 05:36:00 +00:00
Added pre-render sizes to wysiwyg code blocks
Sets sizes on WYSIWYG code block sections based on content lines as an early pre-codemirror height prediction to avoid excessive jumping in the editor. For #3326
This commit is contained in:
parent
8594f42584
commit
d2b49084b0
@ -97,11 +97,18 @@ function defineCodeBlockCustomElement(editor) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this.cleanChildContent();
|
this.cleanChildContent();
|
||||||
|
const content = this.getContent();
|
||||||
|
const lines = content.split('\n').length;
|
||||||
|
const height = (lines * 19.2) + 18 + 24;
|
||||||
|
this.style.height = `${height}px`;
|
||||||
|
|
||||||
const container = this.shadowRoot.querySelector('.CodeMirrorContainer');
|
const container = this.shadowRoot.querySelector('.CodeMirrorContainer');
|
||||||
const renderCodeMirror = (Code) => {
|
const renderCodeMirror = (Code) => {
|
||||||
this.cm = Code.wysiwygView(container, this.getContent(), this.getLanguage());
|
this.cm = Code.wysiwygView(container, content, this.getLanguage());
|
||||||
Code.updateLayout(this.cm);
|
Code.updateLayout(this.cm);
|
||||||
|
setTimeout(() => {
|
||||||
|
this.style.height = null;
|
||||||
|
}, 1);
|
||||||
};
|
};
|
||||||
|
|
||||||
window.importVersioned('code').then((Code) => {
|
window.importVersioned('code').then((Code) => {
|
||||||
|
Loading…
Reference in New Issue
Block a user